The Heist Gallery · Broken Images & Links
Broken images and dead links, the-internet's classic sweep: two of four paintings 404, two of four links lead nowhere — find out which.
Four frames on the wall. Two paintings were "borrowed" last night. The labels won't tell.
Broken Images & Links is an easy Data & Files challenge on Fun UI Playground. Broken images and dead links, the-internet's classic sweep: two of four paintings 404, two of four links lead nowhere — find out which. It runs entirely in the browser, with no backend. Every interactive element carries a stable id and data-testid prefixed with “broken-assets-”, and the techniques it exercises are detect broken images, naturalWidth checks, link checking, response status assertions.
At a glance
- Category
- Data & Files
- Difficulty
- easy
- Teaches
- detect broken images · naturalWidth checks · link checking · response status assertions
- Backend
- None — runs entirely in the browser
- Locators
- Stable
idanddata-testid, prefixedbroken-assets-
Selectors on this page
| Locator | What it is |
|---|---|
#broken-assets-img-1 | Paintings: #broken-assets-img-1 … -4 — evaluate el.naturalWidth, or watch the network for 404s |
#broken-assets-link-1 #broken-assets-links | Catalogue links: #broken-assets-link-1 … -4 inside #broken-assets-links — exactly two 404 |
Frequently asked questions
How do I detect a broken image in a test?
Evaluate el.naturalWidth on #broken-assets-img-1 … -4 — a broken image reports zero — or watch the network for the 404s. Exactly two of the four are broken, pointing at /gallery/… paths that do not exist.
How do I check links for dead targets?
Request each href from #broken-assets-link-1 … -4 and assert the status rather than clicking through. Exactly two return 404. This is also the one page on the site that legitimately logs failed image requests to the console.
More Data & Files
Updated
Fun UI Playground — all challenges, bug hunts, getting started, glossary, about.