Frames, Windows & DOM Practice Challenges
Practice iframes, nested framesets, shadow DOM, new windows, modals with focus traps and elements hidden behind overlays.
7 challenges
- Multiverse Portals · Multiple Windows
- Hero Gazette Editor · iFrame Editor
- Mission Control · Nested Frames
- Droid Memory Core · Shadow DOM
- The Waiting Room · Modal & Focus Trap
- The Vanishing Act · Visibility Semantics
- The Reshuffled Floor · Challenging DOM
Frequently asked questions
How do I test content inside an iframe?
Switch into the frame before locating anything, because a locator evaluated on the parent document cannot see into a child document. Then switch back to the top-level document before addressing the parent page again — the classic cause of "element not found" straight after a frame test.
Can automation reach into shadow DOM?
Into open roots, yes: Playwright's CSS engine and Selenium 4's getShadowRoot both pierce them, including nested hosts. Closed roots return null for shadowRoot and are genuinely unreachable from script — asserting that is the correct outcome, not a workaround.
How do I handle a new window or a modal focus trap?
For windows, trigger the popup and switch by handle, asserting inside the new document before switching back. For modals, assert that focus moved into the dialog, cycles within it while open, and returns to the trigger on close.
Other categories
Updated
Fun UI Playground — all challenges, bug hunts, getting started, glossary, about.