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

[Accessibility] buttons inside modal stop working when Screen Reader and keyboard is using

Open ElenaShevchenko opened this issue 3 years ago • 0 comments

Summary: Accessibility issue with focus

Steps to reproduce:

  1. Open demo provided is demo section https://codepen.io/claydiffrient/pen/KNxgav
  2. Switch on Scree Reader (NVDA + Chrome+ Windows in my case)
  3. Use keyboard and push "Enter" on "trigger Modal" button -> Modal is visible
  4. Push "Tab" to chose "Close Modal" button
  5. Click "Enter" -> Nothing happens, modal is not closed

Additional notes:

In case user will use mouse instead keyboard everything will work. In case Screen Reader will be switched on when modal is already opened everything will be ok

Looks like modal lost focus some how.

ElenaShevchenko avatar May 04 '22 15:05 ElenaShevchenko