Created attachment 429583 [details] Screen recording of bug 1. Using iOS 14.4.2, open https://codepen.io/graynorton/full/yLMbxXE in Safari or Chrome. 2. Flick or drag within the blue-bordered element to scroll vertically. Expected result: Scrolls smoothly, with velocity Actual result: For each flick or drag gesture, scrolls only ~10 pixels and stops Works as expected in Safari, Chrome, Firefox desktop (OS X). Works as expected in Chrome Android. In Mobile Safari, scrolling stops whenever a child element is added to or removed from the scrolling element, which has a shadow root with a single <slot> element inside it. In this repro case, the first child is removed and immediately re-added whenever the element's scrollTop changes by > 10 pixels, but the same problem occurs with any addition or removal of child elements, regardless of whether the mutation is triggered by a scroll event.
<rdar://problem/78430637>
Does this reproduce in a simple case without any shadow DOM?
No, the same repo, without shadow DOM works correctly.
(In reply to Simon Fraser (smfr) from comment #2) > Does this reproduce in a simple case without any shadow DOM? No, unless there's some other way of triggering the issue that I'm not aware of. Here's a lightly modified version of the same example without Shadow DOM, which scrolls as expected in Mobile Safari: https://codepen.io/graynorton/full/PopRGbQ