Color Converter: the contrast checker's colour pickers drop the alpha #428

Which tool?

Color Converter

What happened?

The colour pickers next to "Text / Foreground" and "Surface / Background" in the contrast checker drop the alpha. Type #00000080 in the foreground field, click its swatch and pick any colour, and the field becomes #rrggbb, so the colour is fully opaque again and the contrast ratio and WCAG result change with it. The background picker does the same.

The main picker at the top keeps the alpha: handleNativeColorChange() in ColorConverterClient.tsx puts the current alpha back on the picked colour. The two contrast pickers call setFgInput(e.target.value) and setBgInput(e.target.value) directly (lines 510 and 555), so they skip that.

With #00000080, #00000080 and #ffffff80 in the three fields and #ff0000 picked on each swatch, I get #ff000080 for the main one and #ff0000 for foreground and background.

What did you expect?

The contrast pickers keep the alpha the same way the main picker does, so all three give #ff000080.

I'd make the alpha step in handleNativeColorChange() a small helper that takes the current parsed colour, use it for all three pickers, and add a case to ColorConverterClient.test.tsx that changes the foreground and background pickers and checks the alpha stays.

Browser and OS

Chrome on macOS

Checks

• I searched existing issues and this is not a duplicate.
• This does not include a real secret or token in the reproduction.