react-select icon indicating copy to clipboard operation
react-select copied to clipboard

Accessibility: no way to clear the selection with a keyboard

Open dgreene1 opened this issue 3 years ago • 14 comments

Caveat: I'm not an accessibility expert so perhaps there is an alternative mechanism available to clear selections. But the usual way (tabbing to the clear button) is not working.

Reproduction Steps

  1. open NVDA
  2. visit https://react-select.com/
  3. tab to any select example that has a selected item and that is clearable (at the time of this writing the first example satisfies these conditions)
  4. tab again

Expected Behavior

I would expect Step 4 to focus the "X" that clears the selected option.

Actual Behavior

You can't focus the clear button.

Proposed Solution

Make the clear div a button tag.

Am I Willing To Submit A PR For This?

Yes, absolutely. The company I work for has budget for fixing a11y issues in the open source libraries we use or that we are considering using.

dgreene1 avatar Jan 11 '22 16:01 dgreene1