Bug 244025

Summary: `:visited` link color does not propagate to SVG through `currentColor`
Product: WebKit Reporter: Masataka Yakura <myakura.web>
Component: CSSAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: ahmad.saleem792, karlcow, koivisto, m_dubet, nicolas, webkit-bug-importer
Priority: P2 Keywords: BrowserCompat, InRadar, LayerBasedSVGEngine
Version: Safari 15   
Hardware: Mac (Apple Silicon)   
OS: macOS 12   
See Also: https://bugs.webkit.org/show_bug.cgi?id=70006
https://bugs.webkit.org/show_bug.cgi?id=210005
Attachments:
Description Flags
test case - `:visited` + `fill="currentColor"` none

Description Masataka Yakura 2022-08-17 01:46:50 PDT 
Created attachment 461688 [details]
test case - `:visited` + `fill="currentColor"`

Steps to reproduce:

1. open attachment or go to https://myakura.github.io/test--visited-currentcolor-svg/
2. look at the test case


Expected result:

There is a green square.


Actual result:

There is a red square, in Safari (15.6) and Safari TP (151). It is green in Firefox and Chrome.


Additional comments:

People build customizable icon system by utilizing `fill="currentColor"` set on inline SVGs.

* https://css-tricks.com/cascading-svg-fill-color/
* https://mayashavin.com/articles/svg-icons-currentcolor
* https://gomakethings.com/currentcolor-and-svgs/

However, WebKit doesn't propagate colors set on `:visited` elements. So if such icons are placed inside links, they won't look as expected.

https://stackoverflow.com/questions/68116594/safari-not-showing-visited-color-for-svg-icon-that-is-inside-an-anchor-tag
Comment 1 Masataka Yakura 2022-08-17 01:51:53 PDT 
It may be a part of https://bugs.webkit.org/show_bug.cgi?id=210005 .
Comment 2 Radar WebKit Bug Importer 2022-08-17 04:53:00 PDT 
<rdar://problem/98776770>