Bug 207421 - svg foreignObject with overflow:visible has bad repaints (repaint turds)
Summary: svg foreignObject with overflow:visible has bad repaints (repaint turds)
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: SVG (show other bugs)
Version: Safari 13
Hardware: Mac macOS 10.15
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2020-02-07 17:11 PST by Marijan Lekic
Modified: 2022-07-18 11:35 PDT (History)
8 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Marijan Lekic 2020-02-07 17:11:42 PST 
SVG foreignObject is not rendered correctly when its "overflow" attribute is set to "visible".
When moving such an object it causes famous "frame lag" effect.

Minimum reproducible scenario:

Take a red rectangle and move it (drag it):

https://jsfiddle.net/8xvobd43/3/

UserAgent: "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_3) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.5 Safari/605.1.15"
Comment 1 Alexey Proskuryakov 2020-02-09 18:18:00 PST 
Reproduces with STP too.
Comment 2 Radar WebKit Bug Importer 2020-02-09 18:18:15 PST 
<rdar://problem/59299110>
Comment 3 Simon Fraser (smfr) 2020-02-10 10:41:57 PST 
Not "frame lag", just bad repaints.
Comment 4 Ahmad Saleem 2022-07-18 11:35:03 PDT 
I am able to reproduce (repaint) issue from "JSFiddle" mentioned in Description using Safari 15.5 / Safari Technical Preview 149 on macOS 12.4. Thanks!

Chrome Canary 105 works fine while Firefox Nightly 104 has weird issue, where clicking to drag on "red" box makes it move too fast and go to oblivion out of view port.