Bug 184626

Summary: [css-scroll-snap] Scroll sometimes freezes between snap positions when nested scrolling element receives a scroll in alternate axis against nested scroll containers edge?
Product: WebKit Reporter: jonjohnjohnson <hi>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: bfulgham, simon.fraser, webkit-bug-importer, wenson_hsieh
Priority: P2 Keywords: InRadar
Version: Safari Technology Preview   
Hardware: Mac   
OS: macOS 10.12   

Description jonjohnjohnson 2018-04-13 21:49:24 PDT
I made the title of this bug as specific as I was able to deduce. :/

Observed:
Scroll-snap freezing between scroll-snap positions.

Expected:
Scroll-snap should always snap to a position if type if set to `mandatory`.

Steps to reproduce:

1. Visit this test case -> http://output.jsbin.com/lefekiv/5
2. Scroll horizontally and notice scroll-snapping between full window sized "pages".
3. Scroll vertically within each "page".
4. Sometimes when horizontal snapping hasn't finished, nested vertical scrollers receive a vertical scroll event and freezes horizontal snapping.

I am *pretty sure that it only freezes when the vertical scroll event is happening against an already fully scrolled edge, top or bottom.

Note, this sounds similar to another bug (https://bugs.webkit.org/show_bug.cgi?id=183239), but when I test the bug inducing behaviors for each, what causes failures in one doesn't in the other.

Here is a quick video showcasing the freezing, though not easy to tell when my trackpad commences vertical scrolling:
http://cl.ly/qtlD

As an aside, from what I've seen in the iOS versions of safari, scrolling axises that aren't on the same element, can NEVER happen at the same time, which is nice, and might be a preferred ux paradigm for desktop safari as well? If you offer feedback being in favor of this note, maybe I'll bring up the topic to the csswg about making it a specified behavior for consistencies sake?
Comment 1 Radar WebKit Bug Importer 2018-04-14 00:02:43 PDT
<rdar://problem/39433156>
Comment 2 Wenson Hsieh 2018-04-16 09:40:05 PDT
Thanks for the test case! I can reproduce with the following steps:

1. Scroll vertically in one of the containers, but don't "let go" of the trackpad.
2. Scroll horizontally towards the next page.

For some reason, scroll snapping doesn't kick in when we're notified that scrolling has finished without momentum, if scrolling occurs in an alternate (non-scroll-snapping) axis...