Bug 179724
| Summary: | [SVG2] Styles not applied to targeted SVG elements when using `use` | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Peter Mouland <peter.mouland> |
| Component: | SVG | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | bfulgham, emilio, gwynne, ian, sabouhallawa, zalan, zimmermann |
| Priority: | P2 | ||
| Version: | Safari 11 | ||
| Hardware: | Mac | ||
| OS: | macOS 10.12 | ||
| Bug Depends on: | |||
| Bug Blocks: | 191292 | ||
Peter Mouland
Aim:
To create an SVG containing multiple elements and to re-use this SVG via the <use> element.
I would then like to style each element differently e.g. different stroke/fill colours.
Problem
Chrome, Edge, ie11 and Opera allow me to do this, which is exactly what I would like, unfortunately within Safari (and Firefox) no visible SVG is rendered.
Resolution
My preference would be to have Firefox/Safari behave how Edge (and the others) do,
Please could you confirm this behaviour is a bug?
Links:
CodePen Demo: https://codepen.io/peter-mouland/pen/pdEMWZ
firefox bug: https://bugzilla.mozilla.org/show_bug.cgi?id=1415186
Edge bug: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/14673751/
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Said Abou-Hallawa
*** Bug 212902 has been marked as a duplicate of this bug. ***
Said Abou-Hallawa
*** Bug 212902 has been marked as a duplicate of this bug. ***
Said Abou-Hallawa
A reduced test case is: https://www.w3.org/TR/SVG2/images/struct/Use-changed-styles.svg.
Brent Fulgham
WebKit and Chrome produce identical rendering. Firefox does not.