Skip to content

fix: mark menu notices as disabled options#6101

Draft
wanxiankai wants to merge 1 commit into
JedWatson:masterfrom
wanxiankai:fix/listbox-notice-aria
Draft

fix: mark menu notices as disabled options#6101
wanxiankai wants to merge 1 commit into
JedWatson:masterfrom
wanxiankai:fix/listbox-notice-aria

Conversation

@wanxiankai

Copy link
Copy Markdown

What changed

  • Pass role="option" and aria-disabled="true" to loading and no-options notice components through innerProps.
  • Add regression tests covering both menu states inside the role="listbox" container.
  • Add a patch changeset for react-select.

Why

When the menu is loading or has no matching options, react-select currently renders a plain notice <div> as the only child of a role="listbox". A listbox must own at least one role="option" or role="group", so axe reports an aria-required-children violation.

Treating these non-selectable notices as disabled options preserves the existing visual and runtime behavior while giving the listbox a valid ARIA child. Passing the attributes through innerProps also allows custom notice components that forward those props to retain the same semantics.

Closes #6093.

Validation

  • yarn test:jest --runInBand — 5 suites, 257 tests passed
  • yarn type-check
  • yarn build
  • yarn lint
  • yarn prettier --check .changeset/calm-listboxes-notice.md packages/react-select/src/Select.tsx packages/react-select/src/__tests__/Select.test.tsx
  • yarn changeset status — patch bump for react-select
  • git diff --check

@changeset-bot

changeset-bot Bot commented Jul 13, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: aee0894

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package
Name Type
react-select Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@codesandbox-ci

Copy link
Copy Markdown

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

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.

aria-required-children axe violation: loading and empty states render non-option children inside role="listbox"

1 participant