[Webkit-unassigned] [Bug 227532] New: Styles or Ordering Incorrect when Scrolling Quickly With Large Compositing Layer

[bugzilla-daemon at webkit.org]

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

            Bug ID: 227532
           Summary: Styles or Ordering Incorrect when Scrolling Quickly
                    With Large Compositing Layer
           Product: WebKit
           Version: Safari 14
          Hardware: Mac (Intel)
                OS: macOS 11
            Status: NEW
          Severity: Normal
          Priority: P2
         Component: Compositing
          Assignee: webkit-unassigned at lists.webkit.org
          Reporter: kerryliu at gmail.com
                CC: simon.fraser at apple.com

Created attachment 432604

  --> https://bugs.webkit.org/attachment.cgi?id=432604&action=review

Example test case for background color flashing on fast scrolls

Styling that normally shouldn't be seen from a scrollable (accelerated) element can be visible on a fast scroll. I've isolated this to a small test case, which I've attached to this issue. Folks can also try this out at https://codepen.io/gwwar/pen/BaRawoz

In this test case, the scrollable element has a pink background and a child div that has a white background. If we scroll quickly with a mouse that has a mousewheel, we can see flashes of pink. It should look like the following:
https://user-images.githubusercontent.com/1270189/123994902-af013580-d982-11eb-9cb9-0407bef5df16.mp4

Folks were able to reproduce on both M1 and Intel hardware. The key to reproducing this or not is likely tied to the rate of repaints. I don't see the glitch using the touchpad, but I do with a mouse that has a scroll wheel.

This behavior was originally detected in WordPress Block Editor at https://github.com/WordPress/gutenberg/pull/32747 When added in combination with other bugs, this styling can also bleed through to elements like the scrollbar on the scrollable element. 

https://user-images.githubusercontent.com/1270189/122611446-328f5e00-d036-11eb-8ed1-c30c822add72.mp4

-- 
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/20210630/7794456a/attachment.htm>