[a11y][FormLabel] Assess WCAG 2.2 conformance #49410

Context

Wave 1, item 6. Tracking issue: #49260.

The TextField and RadioGroup reports already test FormLabel indirectly. Check the required indicator (1.3.1, 3.3.2) and the error and disabled contrast (1.4.3).

Scope

1. Add axe tests and fixtures in test/regressions/a11y/fixtures/.
2. Write FormLabel/accessibility.md.
3. Enroll it in the CSS-dependent suite (1.4.10, 1.4.4, 1.4.12).
4. Run pnpm a11y:scorecard.

Manual tests

Write each check in the report as numbered Manual testing steps, as in Button/accessibility.md. pnpm a11y:scorecard then adds them to manual-testing.md. For screen-reader steps, use NVDA with Chrome and VoiceOver with Safari.

• 1.3.1 — With a screen reader, press Tab into a group with FormLabel component="legend". The screen reader announces the label as the group name.
• 3.3.2 — With required, the asterisk shows. The screen reader announces "required" from the control, not only "star".
• 1.4.1 — In the error state, a text message or an icon also shows the error. Red is not the only cue.
• 1.4.3 — With a contrast checker, measure the label in the resting, focused and error states, in light and dark mode. Each is at least 4.5:1.
• 1.4.4 — At 200% page zoom, the label is fully visible.

Done when

• FormLabel has a report and is in the scorecard.
• Each manual test in this issue has steps and a result in the report.

Search keywords: