| Summary: | CSS transition not applied if color and fill="currentColor" in same SVG element | ||||||
|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Jan Bösenberg <jan.boesenberg> | ||||
| Component: | Animations | Assignee: | Nobody <webkit-unassigned> | ||||
| Status: | RESOLVED DUPLICATE | ||||||
| Severity: | Normal | CC: | ahmad.saleem792, ap, dino, graouts, graouts, jan.boesenberg, rniwa, sabouhallawa, simon.fraser, webkit-bug-importer, webkit, zimmermann | ||||
| Priority: | P2 | Keywords: | BrowserCompat, InRadar | ||||
| Version: | Safari 11 | ||||||
| Hardware: | Unspecified | ||||||
| OS: | Unspecified | ||||||
| Attachments: |
|
||||||
Still present in Safari Technology Preview Release 130 (Safari 15.0, WebKit 16612.1.26.1.5). Bug is also present when `stroke: currentColor` Both Firefox and Chrome have the correct behavior here, Safari is the outlier. I am able to reproduce this bug in Safari 15.5 on macOS 12.4 and witnessing same result as mentioned in Comment 01 and left element change abruptly from red to blue rather than transition like right box. Thanks! This seems to be fixed in Safari Technology Preview 163 and now transition properly. I think we can mark this as "RESOLVED CONFIGURATION CHANGED" now. Appreciate if someone else can confirm as well. Thanks! Thanks for testing Ahmad. This was fixed in 259082@main, so marking as a dupe of bug 250718. *** This bug has been marked as a duplicate of bug 250718 *** |
Created attachment 340569 [details] Concise test case for reproducing the issue Open the attached test case and move the mouse over the squares. In both cases the color should fade from red to blue. In the left example, where color and fill="currentColor" are set on the same element, the transition is ignored and the color changes abruptly from red to blue. In the right element the color is applied to the containing group element. The transition is applied correctly.