[NorwegianDude]

> For example, double tapping on the screen triggers a zoom, and there's no way to disable it.

That's objectively BS and 100 % skill issue on your side. A simple "disable zoom PWA" search on google would definitely give a bunch of sites telling you how to do it. It's super simple, just add a viewport meta tag.

[mvkel]

It's not a viewport meta tag. It's { touch-action: manipulation; }.

And it doesn't work consistently. Very easy to break it if you double tap on the background and not somewhere in the text, for example.

Thanks for your... encouragement?

[anon373839]

Try:

  * { touch-action: manipulation; }

While you're at it:

  * { 
      user-select: none; 
      -webkit-user-select: none;
      -webkit-tap-highlight-color: transparent;
      -webkit-touch-callout: none; 
  }

Then, you can override these if needed for specific elements.

Since the "frame" of a native app isn't wiggly and pinchable, I also suggest something like:

  html {   
    height: 100svh;
    overflow: hidden;
    overscroll-behavior: none;
    position: fixed;
  }

  body { 
    height: 100svh;
    width: 100vw;
    overflow: hidden;
    touch-action: none;
    position: fixed;
  }

The idea is to never let html or body exceed the size of the viewport, lock them down completely, and then enable overflow scrolling only in the divs that need it. This also eliminates pull-to-refresh when the app is used inside the browser. (If you want PTR functionality in the app, of course you can watch for overscroll on a particular div and implement it yourself. But your app skeleton will stay put.)

[mvkel]

Thanks for sharing these! Locking down the size of the viewport did the trick

[beretguy]

> That's objectively BS and 100 % skill issue on your side.

Why so aggressive?

[fodkodrasz]

It is 100% a skill issue (in communications skills)