See #3159
Even though they seem like they should, things like this just don't work well:
<div role="button" id="pass7" tabindex="0">
<button aria-hidden="true" tabindex="-1">hidden</button> text
</div>
<div role=checkbox aria-checked=true tabindex=0 aria-label=foo>
<input type=checkbox aria-hidden=true tabindex=-1> <!-- visually hidden -->
</div>The button / input inside will still be packed up by various AT, that are trying very hard to ensure they don't miss things. This is by no means obvious, and so it would be good to add a specific message key to the no-focusable-content check that reports that using aria-hidden and negative tabindex is not a reliable way of hiding interactive elements. We should have a second message for role=none|presentation and negative tabindex too, just so we don't try to combine too many things.
See ariaErrormessageEvaluate for an example of how to use messageKey.
See #3159
Even though they seem like they should, things like this just don't work well:
The button / input inside will still be packed up by various AT, that are trying very hard to ensure they don't miss things. This is by no means obvious, and so it would be good to add a specific message key to the no-focusable-content check that reports that using aria-hidden and negative tabindex is not a reliable way of hiding interactive elements. We should have a second message for role=none|presentation and negative tabindex too, just so we don't try to combine too many things.
See ariaErrormessageEvaluate for an example of how to use
messageKey.