search

Shift3 / boilerplate-client-react

The Bitwise standard starting point for new React web projects.
7 stars 10 forks source link

[A11y] - [aria-hidden='true'] elements contain focusable descendants #591

Open brianifoster opened 2 years ago

brianifoster commented 2 years ago

Describe the bug

Because the Delete button is a descendant of an element with [aria-hidden='true'], it is not available to users of assistive technologies like screen readers

Expected behavior

If you're hiding a container element on your page using aria-hidden, you also need to prevent users from navigating to any focusable elements inside that container (original article)

To Reproduce

Steps to reproduce the behavior:

  1. Go to Directory
  2. Tab into the list
  3. Verify the Delete button has no focus on it

Screenshots

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

Notes

This is also an issue for the Users list. The ... to the right of each user is a descendant of an element with [aria-hidden='true']. Go here to find out how to fix this issue.

brianifoster commented 1 year ago

The 2 specific issues addressed in this issue (Delete in Directory and ... in User List) no longer have this issue.