A permanent collection of six
Six defects from real project work, with the names taken off. Each one is here as an object you can handle: break it, watch the fix land, then read why it happened and what stops it coming back.
Featured exhibit
A mobile navigation drawer left the page behind it scrollable, and the fix for that made the page take a second and a half to scroll back into place every time the drawer closed.
Read the whole storyScroll the phone with the wheel, a finger, or the controls next to it.
Five frames after the close
Close the drawer from somewhere in the middle to sample them.
What the page did
Nothing yet — try a control above.
The phone in the case is a scroll container in this page, and it really does carry scroll-behavior: smooth, so the difference between First fix and Fixed is the browser’s own behaviour, at this browser’s speed. Two things are simplified. Focus is only ever returned with preventScroll, so only the scroll restore is shown. And where the browser does not animate the scroll itself, the case plays a shorter stand-in, in steps if you have asked for reduced motion, so there is still something to watch.
What you are looking at
The scrim stops clicks, not scrolling — the page keeps moving behind the drawer.
The collection
Showing 6 of 6 exhibits
A mobile navigation drawer left the page behind it scrollable, and the fix for that made the page take a second and a half to scroll back into place every time the drawer closed.
Asking a circuit breaker whether a request was allowed consumed the one probe that would have let it recover.
A streak counted backwards in fixed 24-hour steps, so just after midnight, once the clocks had gone forward, it stepped over a date and came up one day short.
A React effect listed among its dependencies a state that its own side effect changed, so the speech recogniser started, cancelled itself, restarted, and transcribed almost nothing.
Deleting an account in one tab made a second tab notice the missing profile and recreate it.
A delay before advancing to the next blank left the form live, so a second Enter queued a second timer and skipped a question entirely.
How to visit
Every case has a Broken / Fixed switch, and three of them have a First fix in between. The object in the case runs a re-implementation of that version — in one case, a step-by-step script.
Scroll the phone, fail the requests, press Enter twice. Nothing here is a video, and nothing runs code you type.
The explanation, the code and the regression test are underneath; the test and the simulation link to the files in this repository that hold them.