Chromium: Pseudo-elements are rendered in the wrong colours in Chromium 124 when using Windows High Contrast

[querkmachine]

Upstream bug: https://issues.chromium.org/issues/337900469
Date: 2024-04-30
Reported by: @querkmachine
Related to: alphagov/govuk-frontend#4962

---

Overview

As of Chromium 124, forced colours are no longer being applied to pseudo-elements when Windows High Contrast Mode is active.

Instead, user agent colours are used regardless of the contrast theme being used or the colours inherited from the parent container, creating the potential for inaccessible colour contrast on various elements.

The currentcolor keyword also does not work as expected, although system colour keywords such as CanvasText or LinkText do.

This is not constrained to the GOV.UK Design System, and the same issue exists on native HTML elements that make use of pseudo-elements, such as bulleted or numbered lists and details/summary elements.

Expected result

Pseudo-elements should inherit the colours of their parent elements if currentcolor is being used, or otherwise use the defined contrast theme colour.

For example, the Design System uses the currentcolor keyword to inherit the label's text colour and ensure that checkbox borders and the check mark are visible. (Screenshot from Edge 123.)

Actual result

Pseudo-elements always use the colours defined in the user agent stylesheet, unless a system colour keyword has been explicitly applied to the pseudo-element.

The checkbox borders and check mark are now using the user agent stylesheet's colour of black, making them invisible in the High Contrast Black theme. (Screenshot from Edge 124.)

[querkmachine]

This bug has now been marked as fixed by the Chromium team, with the fix merged into both the v124 and v125 branches.

That probably that we'll see a bugfix release of Chrome 124 and Edge 124 that includes this very soon. I'm keeping this open until we can corroborate that.

[36degrees]

Looks like the fix for this has rolled out in Chrome 124.0.6367.201 (it's in the diff between 124.0.6367.158 and 124.0.6367.201).

It's also in Chrome 125.0.6422.41 (see the diff between 125.0.6422.26 and 125.0.6422.41).

So all versions in the current stable release (Chrome do a staged rollout) now include this fix. I think we can probably close this?

(In case it's useful, this is the Chromium dashboard that you can use to compare versions)

[querkmachine]

@36degrees I've been waiting for the fix to have been released to Edge stable as well.

It seems likely to have happened already (there were bugfix releases on the 10th and 14th) but their release notes only explicitly mention security fixes. Testing it myself, it appears that at least of the release on the 14th, this fix has shipped in Edge too.