Mission Control · Nested Frames

Q: How do I work with nested frames and framesets?

Walk the tree one level at a time. iframe#nested-frames-root loads a real : frame[name="frame-top"] holds its own frameset of left, middle and right, with frame[name="frame-bottom"] below. Each leaf document has naming its station.

Q: Why do my waits misbehave on a frameset page?

Because a top-level frameset document has no , so any readiness check waiting for body content never settles. Switch by frame name, assert inside the leaf documents, and switch back to top before addressing the parent page again.

A genuine 1998-grade frameset with five nested frames, each its own document. Walk the frame tree and find your way back out.

Five stations, one frameset, zero mercy. Report each station's status to Houston.

Nested Frames is a hard Frames, Windows & DOM challenge on Fun UI Playground. A genuine 1998-grade frameset with five nested frames, each its own document. Walk the frame tree and find your way back out. It runs entirely in the browser, with no backend. Every interactive element carries a stable id and data-testid prefixed with “nested-frames-”, and the techniques it exercises are frame trees, nested frame switching, frame-by-name lookup, escaping to top.

At a glance

Category: Frames, Windows & DOM
Difficulty: hard
Teaches: frame trees · nested frame switching · frame-by-name lookup · escaping to top
Backend: None — runs entirely in the browser
Locators: Stable id and data-testid, prefixed nested-frames-

Selectors on this page

Locator	What it is
`iframe#nested-frames-root`	The challenge page embeds /frames/nested.html in iframe#nested-frames-root
`[name="frame-top"]` `[name="frame-bottom"]`	nested.html is a real <frameset>: frame[name="frame-top"] contains its own frameset with frames left / middle / right; frame[name="frame-bottom"] sits below

Frequently asked questions

How do I work with nested frames and framesets?

Walk the tree one level at a time. iframe#nested-frames-root loads a real <frameset>: frame[name="frame-top"] holds its own frameset of left, middle and right, with frame[name="frame-bottom"] below. Each leaf document has <body id="station"> naming its station.

Why do my waits misbehave on a frameset page?

Because a top-level frameset document has no <body>, so any readiness check waiting for body content never settles. Switch by frame name, assert inside the leaf documents, and switch back to top before addressing the parent page again.

More Frames, Windows & DOM

Updated 2026-09-07

Fun UI Playground — all challenges, bug hunts, getting started, glossary, about.