[css-variables][css-pseudo] Question about setting variable values in pseudo classes #10778
Description
My colleague and I are trying to figure out if this is a browser bug (in all browsers) or an exception in a standard.
Let's say we have HTML
<a href="https://codepen.io/">Codepen</a>and CSS
:root {
--color: red;
}
a {
color: var(--color);
}
a:hover {
--color: green;
}
a:visited {
--color: purple;
}As the link is visited and last setting of --color is purple, the color of the text in the link should be purple. Except it's not, it remains red.
If this behavior with :visited was consistent with all pseudo-classes, I wouldn't question it as in the spec is written that variables apply to all elements and all pseudo-elements. On hover the text turns green with the code above in Firefox, Chrome and Safari.
My question is, is ignoring the setting of --color in a:visited a standards bug or should we make reports to browsers' issue trackers?