[Webkit-unassigned] [Bug 286616] New: scroll-snap and moving slotted element within web component / custom element

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Tue Jan 28 05:08:30 PST 2025


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

            Bug ID: 286616
           Summary: scroll-snap and moving slotted element within web
                    component / custom element
           Product: WebKit
           Version: Safari 18
          Hardware: All
               URL: https://codepen.io/klipstein/pen/JoPwgdy
                OS: All
            Status: NEW
          Severity: Major
          Priority: P2
         Component: Scrolling
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: tobias at klpstn.com
                CC: simon.fraser at apple.com

When the `<slot>` node of a web component gets moved within its shadow-root during scroll and scroll-snap is enabled it leads to scroll jumps. 

Here is a test-case for this scenario: https://codepen.io/klipstein/pen/JoPwgdy

The test-case is as such: within a web component there is vertical scroller with scroll-snap and when one of the cards is visible by 50% it moves the "<slot></slot>" to this card. This would be useful when implementing vertically scrollable video players, where the same video instance is moved to the current visible card. 

When the scroll container gets scrolled slow it somehow jumps directly to the slotted element and when you scroll fast it leads to strange scroll jumps.

This bug can be verified in Safari 18 (Mac OS), Safari Technology Preview (Mac OS) and iOS Safari (Version 18.2.1).

-- 
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/20250128/01292397/attachment-0001.htm>


More information about the webkit-unassigned mailing list