Bug 207421

Summary:	svg foreignObject with overflow:visible has bad repaints (repaint turds)
Product:	WebKit	Reporter:	Marijan Lekic <marijanlekic89>
Component:	SVG	Assignee:	Nobody <webkit-unassigned>
Status:	NEW ---
Severity:	Normal	CC:	ahmad.saleem792, ap, dino, sabouhallawa, simon.fraser, webkit-bug-importer, zalan, zimmermann
Priority:	P2	Keywords:	InRadar
Version:	Safari 13
Hardware:	Mac
OS:	macOS 10.15
See Also:	https://bugs.webkit.org/show_bug.cgi?id=207586

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.