You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
ARC Toolkit is used for covering accessibility defects. When a modal is open, the data-react-modal-body-trap elements each generate the error "Non-active element in tab order", and the app root generates the error "aria-hidden used on parent of focusable"
For the "Non-active element in tab order" errors, I was able to suppress them by adding aria-hidden to the body traps. I'm not sure what the solution for setting #root to aria-hidden would be. I was able to suppress the error and keep the button out of the tab order by setting #root[disabled], but I don't know that suppresses all the screen reader content below it.
The text was updated successfully, but these errors were encountered:
@Fordi This problem happens because you are setting the app element to the #root, which contains all your application. The correct way is to create and adjacent element to place the modals.
Summary:
ARC Toolkit is used for covering accessibility defects. When a modal is open, the
data-react-modal-body-trap
elements each generate the error "Non-active element in tab order", and the app root generates the error "aria-hidden
used on parent of focusable"Steps to reproduce:
Pre-req: have ARC toolkit installed
Expected behavior:
No new errors generated
Link to example of issue:
Sandbox starter: https://codesandbox.io/s/9xnen
Additional notes:
For the "Non-active element in tab order" errors, I was able to suppress them by adding
aria-hidden
to the body traps. I'm not sure what the solution for setting #root toaria-hidden
would be. I was able to suppress the error and keep the button out of the tab order by setting#root[disabled]
, but I don't know that suppresses all the screen reader content below it.The text was updated successfully, but these errors were encountered: