[Webkit-unassigned] [Bug 235960] New: [css-scroll-snap] scroll-snap-align: none causes scroll position to reset when swiping

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Tue Feb 1 09:20:48 PST 2022


https://bugs.webkit.org/show_bug.cgi?id=235960

            Bug ID: 235960
           Summary: [css-scroll-snap] scroll-snap-align: none causes
                    scroll position to reset when swiping
           Product: WebKit
           Version: Safari Technology Preview
          Hardware: iPhone / iPad
                OS: iOS 15
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Scrolling
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: sean at ionic.io
                CC: simon.fraser at apple.com

When swiping on a mobile device in a CSS scroll container implementation, the child element will not animate consistent with the swipe gesture when the sibling element has scroll snap disabled. This results in the child element flickering back to its initial position, while ignoring overflow style rules.

Steps to reproduce:

1. Go to test case on an iOS mobile device -> https://codepen.io/liamdebeasi/pen/zYPqKXR
2. Swipe slowly horizontal to the disabled child and release the touch gesture
3. Notice the animation is smooth back to the starting point.
4. Notice the image respects the overflow: hidden style with the border-radius.
5. Swipe quickly horizontally in the same direction as step 2 and release the touch gesture.
6. Notice the animation is non-existent and the element repaints immediately to the start position.
7. Notice the image repaints without respecting overflow: hidden for a frame and finally repaints correctly.


Expected:

- The animation for scroll snap implementation should be consistent, regardless of swipe gesture speed.
- Scroll snap should not override child overflow style rules.


Additional info:

- iOS 15.3 / iPhone Xs Max
- Mobile Safari

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20220201/67b1f72d/attachment.htm>


More information about the webkit-unassigned mailing list