Bug 273031 – [Regression: Safari 17.2+] Scrollable elements with `pointer-events: none` prevent scroll events to pass through underlying scrollable sibling elements

• Status: RESOLVED
• Resolution: FIXED
• Component: Scrolling

[Hernán Sartorio]

If I have a scrollable element A with `pointer-events: none` overlaid on top of another scrollable sibling element B with `pointer-events: auto`, I’d expect scrolling with the pointer over B would scroll element A but it does not.

Tested in Safari 17.4.1 (macOS 14.4.1) and Safari Technology Preview Release 192.

It does work as expected in Chrome and Firefox. Also in Safari 17.1 on macOS Ventura.

Here’s an example reproducing it: https://codesandbox.io/p/devbox/safari-bug-kyzvjt

[Radar WebKit Bug Importer]

<rdar://problem/126865799>

[Karl Dubost]

Thanks for the report and test case Hernan

To better understand the steps to reproduce

1. Load https://codesandbox.io/p/devbox/safari-bug-kyzvjt?file=%2Findex.html
2. Over the cursor on the left area
3. Scroll (A)
4. Move the cursor on the middle area
5. Scroll (B)
6. Move the cursor the right area 
7. Scroll (C)

Check if Underlaid Content is being scrolled.

Try this with the three browsers (latest versions):
                  A   B   C
Safari STP......  OK  x   x   
Firefox Nightly.  OK  OK  x
Chrome Canary...  OK  OK  x

[Ahmad Saleem]

Adding 'Regression' in title assuming from comment 0 that it was working as expected in Safari 17.1

[Simon Fraser (smfr)]

Created attachment 471120 [details]
Standalone test case

[Simon Fraser (smfr)]

In RemoteScrollingTreeMac::scrollingNodeForPoint() I think the `isScrolledBy(*this, nodeID, frontmostLayer)` logic is wrong.

[Matthieu Dubet]

Pull request: https://github.com/WebKit/WebKit/pull/27779

[EWS]

Committed 278084@main (34e7db744efe): <https://commits.webkit.org/278084@main>

Reviewed commits have been landed. Closing PR #27779 and removing active labels.