[mainframev]

Previous Behavior

In forced colors mode, hovering a MenuItem (and every item built on its styles: checkbox, radio, link, switch, split) kept the Canvas background and only turned the label Highlight. The borderColor: 'Highlight' rule had no effect because the item has no border. The icon, checkmark, secondary content and subtext kept their token colors, which forced colors maps to CanvasText. The open-submenu state had the same problem.

New Behavior

Hovered and open-submenu items use the standard high contrast treatment: a Highlight background, with HighlightText on the item and all of its slots.

• The hovered item opts out with forcedColorAdjust: 'none'. Without it, Chromium paints a Canvas text backplate over the Highlight background and the label turns into a black box. Tab and InteractionTag do the same thing.
• Disabled items still win on hover with Canvas and GrayText. They reset forcedColorAdjust to auto and now cover the checkmark and secondary content as well.

The screenshots come from Chromium's forced-colors emulation (emulateMedia({ forcedColors: 'active' })) on the MenuList Default, Checkbox items and Nested submenus stories.

Verification: nx run-many -t test type-check lint -p react-menu passes.

Related Issue(s)

• ADO 18832