Bug 250999

Created attachment 464601 [details] A video of the bug VoiceOver navigation breaks down on a specific combination of scroll-snap and large media items. A combination of large fixpos images and scroll snap seems to break VoiceOver navigation. I'm not sure what exactly causes the bug, but I have been able to reproduce the issue in this codepen: https://codepen.io/johannesodland/pen/VwBQMXJ. The codepen must be opened in debug mode on an iPhone. A video of the issue is attached. The codepen consists of a set of fixpos images with `height: 100vh` and a set of sections that have `height: 100vh` and `scroll-snap-align: top`; Expected result: One should be able to navigate all the elements of the page in sequence: - Link - Image Description 1 - Section 1 - Image Description 2 - Section 2 - Section 3 - Section 4 Actual result: VoiceOver navigation breaks down, and routes you back to an earlier item: – Link – Image Description 1 - Section 1 - Image Description 2 (Browser chrome resizes) - Image Description 1 - Link - Section 1 Observations: 1. The bug seems to happen after a visual glitch or browser chrome retracting: When VoiceOver focuses on an image that is the size of the large viewport the browser-chrome/url-bar retracts to make room for the image. The frame after it often reappears again, probably due to scroll-snap. The bug appears after this. VoiceOver gets stuck in a loop, and it can only be broken by touching and setting VoiceOver focus somewhere else. 2. VoiceOver struggles with scroll-snap on :root in general. It will sometimes focus on an element, but scroll-snap will snap to a different element. As a result the element focused by VoiceOver ends up outside the screen. 3. The bug is not deterministic. Sometimes things work fine, sometimes it breaks down. It might be timing related. I'm setting severity to major as this makes some pages inaccessible to VoiceOver users and I'm not sure of the exact cause and extent of this bug. Feel free to change it as you see fit.