Skip to content

As a screen reader user I want loading and error states to be announced automatically so I know when the app is busy or an error occurs #73

@ChristopherRotnes

Description

@ChristopherRotnes

Summary

<InlineLoading> and <InlineNotification> components appear and disappear dynamically in MuscleMap.jsx, History.jsx, Report.jsx, and other pages, but they are not wrapped in aria-live regions. Screen reader users must manually navigate to discover that the app is loading or that an error has occurred. Errors in particular require immediate announcement — a user who submits a form and receives an error should hear it without having to hunt for it.

Priority

High

Acceptance criteria

  • All dynamic error <InlineNotification> instances are wrapped in (or themselves are inside) a role=\"alert\" / aria-live=\"assertive\" region, so errors are announced immediately
  • All <InlineLoading> instances are wrapped in an aria-live=\"polite\" region with aria-busy=\"true\" while loading and aria-busy=\"false\" when complete
  • Verify Carbon's InlineNotification already sets role=\"alert\" internally; if it does, document this; if it does not, add the wrapper
  • Tested with a screen reader: errors are read aloud without manual navigation; loading completion is announced politely

Metadata

Metadata

Assignees

No one assigned

    Labels

    accessibilityScreen reader, keyboard navigation, ARIA, reduced motion

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions