259646 2023-07-31 06:47:52 -0700 [svg] applying `rx` or `ry` through CSS exclusively has no effect 2023-12-18 09:46:54 -0800 1 1 1 Unclassified WebKit SVG Safari Technology Preview Unspecified Unspecified RESOLVED FIXED https://bugs.webkit.org/show_bug.cgi?id=266090 https://github.com/web-platform-tests/wpt/pull/43629 BrowserCompat, InRadar P2 Normal --- 1 kari.pihkala graouts dino graouts jbstrater karlcow sabouhallawa webkit-bug-importer zimmermann oldest_to_newest 1968849 0 467161 kari.pihkala 2023-07-31 06:47:52 -0700 Created attachment 467161 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. 1969898 1 webkit-bug-importer 2023-08-07 06:48:18 -0700 <rdar://problem/113500023> 1998950 2 graouts 2023-12-12 06:26:49 -0800 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. 1998963 3 graouts 2023-12-12 07:04:13 -0800 Pull request: https://github.com/WebKit/WebKit/pull/21679 1998964 4 graouts 2023-12-12 07:04:36 -0800 Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/43629 1999195 5 ews-feeder 2023-12-12 23:10:46 -0800 Committed 271970@main (0eba4b6cab17): <https://commits.webkit.org/271970@main> Reviewed commits have been landed. Closing PR #21679 and removing active labels. 2000454 6 sabouhallawa 2023-12-18 09:46:54 -0800 *** Bug 266090 has been marked as a duplicate of this bug. *** 467161 2023-07-31 06:47:52 -0700 2023-07-31 06:47:52 -0700 rect-rx-animation.svg rect-rx-animation.svg image/svg+xml 567 kari.pihkala PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxz dmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgMjAwIDEw MCI+CgogICAgPHN0eWxlPgpAa2V5ZnJhbWVzIHJ4YW5pbSB7IDAlIHsgcng6IDEwcHg7IH0gMTAw JSB7IHJ4OiAyMHB4OyB9IH0KICAgIDwvc3R5bGU+CgogICAgPCEtLSB0aGlzIGJsdWUgcmVjdCBp c24ndCBhbmltYXRlZCBhcyBleHBlY3RlZCAtLT4KICAgIDxyZWN0IHg9IjMwIiB5PSIzMCIgd2lk dGg9IjUwIiBoZWlnaHQ9IjQwIiBzdHJva2U9ImJsYWNrIiBmaWxsPSJibHVlIiBzdHlsZT0iYW5p bWF0aW9uOiAxcyBsaW5lYXIgYm90aCByeGFuaW07Ii8+CgogICAgPCEtLSB0aGlzIGdyZWVuIHJl Y3QgaXMgYW5pbWF0ZWQgYXMgZXhwZWN0ZWQgLS0+CiAgICA8cmVjdCB4PSIxMjAiIHk9IjMwIiB3 aWR0aD0iNTAiIGhlaWdodD0iNDAiIHN0cm9rZT0iYmxhY2siIGZpbGw9ImdyZWVuIiByeD0iMTAi IHN0eWxlPSJhbmltYXRpb246IDFzIGxpbmVhciBib3RoIApyeGFuaW07Ii8+Cgo8L3N2Zz4K