Ensure <frame> and <iframe> Elements With Focusable Content Do Not Have tabindex=-1
Blind
Mobility
WCAG 2.1 Level A
Web accessibility requirements state that %lt;frame%gt; and %lt;iframe%gt; elements with focusable content must not have tabindex=”-1″.
When a frame has a negative tabindex, a browser cannot redirect the focus to the content inside that frame. This results in all the content getting skipped in keyboard navigation. For frames that are scrollable, it also prevents the focus from reaching any element from which the frame can be scrolled with the keyboard.
Check all <frame> and <iframe> elements that have a negative tabindex number. If these frames exist, check that they do not contain focusable elements, or have nested frames with focusable elements.
The frame-focusable-content rule is inapplicable for frames without tabindex, or with a non-negative tabindex:
<iframe
srcdoc="<button>Click me</button>"
tabindex="0"
title="My frame is an iframe"
></iframe>
Copy
In some cases, if the frame does not need any keyboard navigation or keyboard scrolling, tabindex=”-1″ can be used on iframes.
<iframe
srcdoc="<p>Hello world</p>"
tabindex="-1"
title="My frame is an iframe"
></iframe>
Copy
The frame-focusable-content rule fails the following markup pattern:
<iframe
srcdoc="<button>Click me</button>"
tabindex="-1"
title="My frame is an iframe"
></iframe>
Copy
For more examples, visit W3C’s GitHub’s ATC Rules library.