322849 2026-08-28 08:41:29 -0700 Transitioned CSS filter on an ancestor cancels in-progress touch scrolling on iOS 2026-08-28 09:28:24 -0700 1 1 1 Unclassified WebKit Compositing Safari 26 iPhone / iPad iOS 26 NEW P2 Normal --- 1 esatturan206 webkit-unassigned simon.fraser oldest_to_newest 2244805 0 esatturan206 2026-08-28 08:41:29 -0700 A CSS filter applied on :active and transitioned, set on an ANCESTOR of a scrollable element, causes iOS Safari to abandon a touch scroll that has already begun. Most drags inside the scroller produce no scroll events at all. Reduced test case (static HTML, no framework): https://readkinetic.com/repro/safari-filter-scroll.html The whole of it is two rules: .host { transition: filter 150ms ease-out; } .host:active { filter: brightness(0.95); } where .host is the parent of the scrolling div. Steps to reproduce: 1. Open the URL on an iPhone running iOS 26.6. 2. Drag vertically inside the bordered box. The checkbox is ticked by default, so the filter rule is active. 3. Observe that most gestures scroll nothing. The page counts gestures that produced no scroll event. 4. Untick "filter on ancestor" and repeat the same drags. Expected: the filter changes appearance only; scrolling is unaffected. Actual: with the filter rule active, drags are frequently ignored. On my iPhone 16 Pro (iOS 26.6) I needed up to 25 consecutive drags before one scrolled. With the rule off, every drag scrolled. Notes: - The page around the scroller scrolls normally throughout. Only the inner scrollable element is affected. - Not reproducible in Chrome on Android, or in Safari or Chrome on macOS. - Removing either the transition or the filter avoids it. 2244825 1 simon.fraser 2026-08-28 09:28:24 -0700 I believe this happens when we remove and re-add a UIScrollView to the view hierarchy as ancestor layers change.