Added aria-autocomplete prop to select input#4992
Added aria-autocomplete prop to select input#4992abhijeetranmale7 wants to merge 9 commits intoJedWatson:masterfrom
Conversation
|
|
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. Latest deployment of this branch, based on commit fbcd74e:
|
|
Can we review and approve this please? It's somewhat required for us. Thank you. |
| /** Aria label (for assistive tech) */ | ||
| 'aria-label'?: AriaAttributes['aria-label']; | ||
| /** Aria autocomplete */ | ||
| 'aria-autocomplete'?: 'none' | 'inline' | 'list' | 'both'; |
There was a problem hiding this comment.
inline is not a valid option for this component - https://www.w3.org/WAI/ARIA/apg/patterns/combobox/#wai-aria-roles-states-and-properties-6
There was a problem hiding this comment.
Hi @kethomas, Thanks for the review. I've removed the "inline" option. Please check.
|
Hey @Methuselah96, Can we approve these changes and merge this PR? Thank you. |
|
I would like to know why a year later this PR is still open and it did not merge, it is something very important for a11y Thank you |
4 participants
How it was:
There is no prop available for react select to change aria-autocomplete attribute like we can change aria-label.
The value for aria-autocomplete is set to "list" and is unable to change through props.
Refer the following url to the line of code.
https://github.com/JedWatson/react-select/blob/master/packages/react-select/src/Select.tsx#L1560
Because of aria-autocomplete="list", the screen reader reads out things that the user shouldn't really need to hear. something like "edit text autocompletion lists" is read out.
to prevent that we need to set aria-autocomplete to none. But since it has constant value "list", we are not able to do so.
What I did:
I have added aria-autocomplete prop to the select input with default value as 'list'