Bug 124366
| Summary: | When a CSS Animation is applied to a SVG path that has two property changes, only the last defined property is animated. | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Ben Frain <contact> |
| Component: | SVG | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED CONFIGURATION CHANGED | ||
| Severity: | Major | CC: | bfulgham, kari.pihkala, zimmermann |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | Mac | ||
| OS: | OS X 10.8 | ||
| URL: | http://codepen.io/benfrain/pen/hLFwn | ||
Ben Frain
It should be possible to animate two CSS properties on an SVG with a CSS animation. This behaviour can be seen in Firefox but Safari (and Chrome) only render the last defined property change.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Ben Frain
Chrome had the same issue and it has been confirmed as a bug there: https://code.google.com/p/chromium/issues/detail?id=319407
The workaround is to ensure a fill property is declared (although the is obviously still a bug).
Brent Fulgham
Safari, Chrome, and Firefox all agree on rendering for this test case. I don't believe there is any remaining compatibility issue.
(Tested with test case used in the Chromium bug).