RESOLVED CONFIGURATION CHANGED 279714
SVG stroke-dasharray does not work with mixed units in calc
https://bugs.webkit.org/show_bug.cgi?id=279714
Summary SVG stroke-dasharray does not work with mixed units in calc
Devon Govett
Reported 2024-09-14 07:40:43 PDT
When setting `stroke-dasharray` to a `calc` with mixed units (e.g. percentage and pixels), WebKit resolves the whole calculation to 0 instead of the correct result. For example, `stroke-dasharray="calc(2 * pi * (50% - 2px))" could be used to create a dash array that goes around the length of a circle. The circle is 50% of the width, minus 2px to account for the stroke width. This works with just `2 * pi * 50%`, and works with `2 * pi * (50px - 2px)` but as soon as percentages and pixels are mixed it no longer works. Example: https://codepen.io/devongovett/pen/ZEdNbgE This works correctly in Chrome and Firefox.
Attachments
Radar WebKit Bug Importer
Comment 1 2024-09-21 07:41:12 PDT
Ahmad Saleem
Comment 2 2025-06-13 23:51:07 PDT
Fixed in Safari Technology Preview 221 - it matches now Chrome Canary 139.0.7237.0 (Official Build) canary (arm64) and Firefox Nightly 141 (20250613211349).
Note You need to log in before you can comment on or make changes to this bug.