/fullscreen-web-app-wrong-height

Bug report reproduction test case.

Primary LanguageHTML

fullscreen web app wrong height

Elements in fullscreen web apps on Android Chrome v77.0.3865.116 cannot always be sized to fullscreen.

Reproduction Steps

  1. Serve the web app and visit on Android Chrome. E.g., live-server --host=192.168.1.42.

  2. Install the web app on your home screen.

  3. Launch the web app and rotate to landscape.

  4. Press the home virtual button and note the orientation reverts to portrait.

  5. Swipe the home screen right to open the Google feed (or visit another app but this may reproduce less reliably).

  6. Swipe back.

  7. Launch the web app without changing the orientation. The blue canvas should completely cover the red body but doesn't.

Notes

  • In this scenario, screen.height is correct but all other height measurements including document.documentElement.clientHeight are incorrect.
  • The body is visible and correctly fullscreen but the canvas element cannot be resized to match.
  • The issue does not seem to occur when using "display": "standalone" instead of "fullscreen". I was unable to discover a workaround.
  • The issue resolves on orientation change but this is not possible for a fullscreen game app specifying a fixed orientation.