Skip to content

fix: include stepStateText in StepListItem accessible name#9888

Open
Krishnachaitanyakc wants to merge 1 commit intoadobe:mainfrom
Krishnachaitanyakc:fix/steplist-label-in-name
Open

fix: include stepStateText in StepListItem accessible name#9888
Krishnachaitanyakc wants to merge 1 commit intoadobe:mainfrom
Krishnachaitanyakc:fix/steplist-label-in-name

Conversation

@Krishnachaitanyakc
Copy link
Copy Markdown

Closes #9881

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

  1. Render a StepList with multiple items and various completion states
  2. Inspect each step link's aria-labelledby attribute — it should reference three IDs: the marker number, the step state text (Current/Completed/Not completed), and the label
  3. Verify with a screen reader (e.g., VoiceOver) that each step announces its state as part of the accessible name (e.g., "1 Current: Step 3")
  4. Run yarn jest --no-watchman packages/@adobe/react-spectrum/test/steplist/StepList.test.tsx

🧢 Your Project:

Open source accessibility contribution

Add the VisuallyHidden stepStateText element to the aria-labelledby
of each StepListItem link so screen readers announce the step state
(Current/Completed/Not completed) as part of the accessible name.

This ensures conformance with WCAG SC 2.5.3 Label in Name (Level A)
by including the visually hidden but rendered step state text in the
computed accessible name for each step.

Closes adobe#9881
@Krishnachaitanyakc Krishnachaitanyakc marked this pull request as ready for review April 7, 2026 21:03
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

StepListItem: stepStateText should be included as part of the accessible name for the item

1 participant