[a11y][Alert] Assess WCAG 2.2 conformance #49440

Context

Wave 4, item 11 (lower risk). Tracking issue: #49260.

Include AlertTitle. Focus on role="alert" and 4.1.3 Status Messages, severity shown only by color and icon (1.4.1, 1.1.1), the contrast of the standard, outlined and filled variants (1.4.3) and the name of the close button.

Scope

1. Add axe tests and fixtures in test/regressions/a11y/fixtures/.
2. Write Alert/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.

• 4.1.3 — With a screen reader, add an Alert to the page after load. The screen reader announces it, and focus does not move.
• 4.1.3 — Load a page that already has several Alerts. Record what the screen reader announces. role="alert" on static content can be too assertive.
• 1.1.1, 1.4.1 — The severity is available as text, not only as the icon and the color. Record if the screen reader announces the severity.
• 1.4.3 — With a contrast checker, measure the text of each severity in the standard, outlined and filled variants, in light and dark mode. Each is at least 4.5:1.
• 4.1.2, 2.4.7 — The close button announces "Close" and shows a visible focus indicator.

Done when

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

Search keywords: