WebKit Bugzilla
New
Browse
Log In
×
Sign in with GitHub
or
Remember my login
Create Account
·
Forgot Password
Forgotten password account recovery
RESOLVED FIXED
259646
[svg] applying `rx` or `ry` through CSS exclusively has no effect
https://bugs.webkit.org/show_bug.cgi?id=259646
Summary
[svg] applying `rx` or `ry` through CSS exclusively has no effect
kari.pihkala
Reported
2023-07-31 06:47:52 PDT
Created
attachment 467161
[details]
rect-rx-animation.svg CSS animating the SVG <rect> element rx and ry radius properties has no effect. See the attached rect-rx-animation.svg or this fiddle:
https://jsfiddle.net/861prg29/
The blue rectangle doesn't animate its radius as expected. The green rectangle does animate its radius, because it has its rx attribute set to a non-zero value. But, setting the attribute to a non-zero value shouldn't be necessary. The expected result is that both rectangles are animated. Note that animating the ry property has the same bug as the rx property. Tested on Safari 16.5.2 (18615.2.9.11.10) and Safari Tech Preview Release 174 (Safari 17.0, WebKit 18616.1.22.1). Firefox 115 and Chrome 115 animate both rectangles as expected.
Attachments
rect-rx-animation.svg
(567 bytes, image/svg+xml)
2023-07-31 06:47 PDT
,
kari.pihkala
no flags
Details
View All
Add attachment
proposed patch, testcase, etc.
Radar WebKit Bug Importer
Comment 1
2023-08-07 06:48:18 PDT
<
rdar://problem/113500023
>
Antoine Quint
Comment 2
2023-12-12 06:26:49 PST
Querying the computed style I can see that the animations is indeed applied through our style system. However, the rendering does not account for it. My guess is that we have a quick check for `rx` and `ry` being set on an element and not accounting for the RenderStyle. In fact this seems unrelated to animations and strictly a CSS integration with SVG problem since: … <rect width="50" height="50" rx="1" style="rx: 10px" /> will yield a rectangle with rounded corners while this: <rect width="50" height="50" style="rx: 10px" /> … will not. Clearly having the `rx` attribute is important for rendering of the `rx` value set through CSS.
Antoine Quint
Comment 3
2023-12-12 07:04:13 PST
Pull request:
https://github.com/WebKit/WebKit/pull/21679
Antoine Quint
Comment 4
2023-12-12 07:04:36 PST
Submitted web-platform-tests pull request:
https://github.com/web-platform-tests/wpt/pull/43629
EWS
Comment 5
2023-12-12 23:10:46 PST
Committed
271970@main
(0eba4b6cab17): <
https://commits.webkit.org/271970@main
> Reviewed commits have been landed. Closing PR #21679 and removing active labels.
Said Abou-Hallawa
Comment 6
2023-12-18 09:46:54 PST
***
Bug 266090
has been marked as a duplicate of this bug. ***
Note
You need to
log in
before you can comment on or make changes to this bug.
Top of Page
Format For Printing
XML
Clone This Bug