Web iframe

How to test an iframe

Gherkin Condensed

Given that I am on a screen with an iframe

WHEN I use the arrow keys or tab key I SEE the content of the iframe is browsed

WHEN I use a desktop screenreader (NVDA, JAWS, VoiceOver) AND I use the arrow keys or tab key
- I HEAR The title of the iframe is read if the iframe contains content
- I HEAR If the iframe does not contain content, the iframe is ignored

WHEN I use a screenreader AND I swipe to content in the iframe
- I HEAR The title of the iframe is read if the iframe contains content
- I HEAR If the iframe does not contain content, the iframe is ignored

When I use	I see/hear
Arrow keys	Content within the iframe is browsed
Tab	Interactive content in the iframe come into view

When I use	I hear
Swipe	Content within the iframe is browsed

Reads	I hear
Name	The title of the iframe is read if the iframe contains content
Group	If the iframe does not contain content, the iframe is ignored

<iframe title="Coffee maker demonstration" 
        src="coffee-maker-demo.html">
</iframe>

Add title="Hidden intentionally" so future developers don’t remove aria-hidden="true"

<iframe title="Hidden intentionally"
        aria-hidden="true" 
        src="script-injection.net">
</iframe>