Bug 240241 – Scrolling outer scroll-snap container during overscroll causes inner scroll-snap container not to snap

• Status: NEW
• Component: Scrolling

[Bruno Stasse]

Created attachment 459057 [details]
testcase

Hello,

With two nested scroll-snap containers, one horizontal, and the other vertical, when the inner container is overscrolled, and the outer container is scrolled during the rubberbanding, the inner container does not snap as it should. Instead, it gets blocked at its current position.

Steps to reproduce in the testcase horizontal inside vertical:
- scroll down to have the nested horizontal scroll-snap container in view
- scroll all the way to the right to cause overscroll
- without waiting for the end of rubberbanding, scroll up to cause vertical scrolling in the outer container
- see the inner horizontal scroll-snap container get stuck, not snapping to the last target as it should

Steps to reproduce in the testcase vertical inside horizontal:
- scroll right to have the nested vertical scroll-snap container in view
- scroll all the way down to cause overscroll
- without waiting for the end of rubberbanding, scroll left to cause horizontal scrolling in the outer container
- see the inner vertical scroll-snap container get stuck, not snapping to the last target as it should

Note that you might also experience this bug while testing: https://bugs.webkit.org/show_bug.cgi?id=236536 (you can actually see it in the first test in the attached video).

Probably related to these:
- https://bugs.webkit.org/show_bug.cgi?id=183239 (marked as fixed)
- https://bugs.webkit.org/show_bug.cgi?id=184626 (testcase not working and video unavailable)

Please let me know if you need additional information.

[Bruno Stasse]

Created attachment 459058 [details]
testcase-video

Video of the testcase.

[Radar WebKit Bug Importer]

<rdar://problem/92977458>

[Bruno Stasse]

I just came across this bug report from 2018 which might be about the same bug, or at least related: https://bugs.webkit.org/show_bug.cgi?id=184626