Safari Full screen and Visual Viewport Bug

This demonstrates a Safari Mobile bug where the visual viewport and layout viewport become mismatched after exiting fullscreen mode.

  1. Note the header is flush with the top of the page. If pulling down to reload (either fully or partially), the page will spring back to top
  2. Check the viewport measurements below: they should match, a difference of 1px can happen depending on scaling
  3. Click "Enter Full-Screen" below, then exit full screen
  4. Now, pulling down to reload (either fully or partially), the page will be left permanently with a gap
  5. Note the mismatch between document client and visual viewport heights, of 24px at scaling 1
  6. Refresh the page - the issue and viewport mismatch persist
  7. Only force closing Safari and starting again will restore the original behaviour

Document client: -
Window inner: -
Visual viewport: -
Viewport difference: -