Carbon: Carbon Radio Button Selection not visible in Windows High Contrast Mode

Created on 8 Jan 2019  ·  4Comments  ·  Source: carbon-design-system/carbon

  1. Find a Windows machine, or use a Windows VM
  2. Open either IE, Edge, or Firefox (Chrome does not show the problem because it does not honor Windows high contrast mode... instead it relies on 3rd party extensions to do high contrast).
  3. Go to the Carbon Radio Button page.
  4. Type left Alt + left Shift + PrintScreen (then Yes) to turn on Windows high contrast mode
  5. Select one of the radio buttons.
  6. You can't see the blue dot, so there's no way to know that the radio is selected.
    (This is probably because background colors and background images are ignored in high contrast mode)

Note that the example radio buttons in the ARIA Practices Guide work correctly in Windows High Contrast mode.

image

Notes:

high 😱 1 🚨 a11y ♿ bug 🐛

All 4 comments

We've marked this issue as stale because there hasn't been any activity for a couple of weeks. If there's no further activity on this issue in the next three days then we'll close it. Thanks for your contributions.

Still a problem.
Note point 2 in initial comment: IE, Edge, or Firefox. Not Chrome.

Yep! We've addressed this upstream in the elements repo and are waiting on those fixes to get utilized in the core repos.

You can track that work here
https://github.com/carbon-design-system/carbon-components/issues/2104

@dakahn is the radio button an icon in this case? Seems like it's implemented in CSS and will need a fix in there, as a result.

Was this page helpful?
0 / 5 - 0 ratings