Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
A positive
tabIndex
has become a significant accessibility flag. The axe devtools bot flags anytabIndex={1}
on your page as a serious error. Even though this element with atabIndex
of1
isn't really part of the direct user experience, it's best to get rid of any positive indices on your page.I found that when setting
noFocusGuards
, things worked fine when developing your storybook examples, but on my own setup this popped the focus out of the lock.As I understand the issue, the
tabIndex
value of1
here handles cases when devs have other elements on their pages with a positive index.It seems to me there would be two options:
maxTabIndex={0}
) that would override the current positive index0
and allowing users with other positive indices on their sites to set a prop that would override it to1
I believe the latter is a cleaner api and allows for default accessibility compliance, but the former offers backwards compatibility for devs who are using positive indices on their pages.
This PR has two commits for each option, respectively.