The page below runs eight bits of asynchronous work and writes each one into the list as it completes. Read the source first and write down the order you expect. Then look at what it printed. The gap between the two lists is the lesson, and the gap is bigger than most people expect even after they have read the spec.

Use the model as a pair here, not to fix anything yet, but to argue with. Paste the source and your predicted order, ask it to explain the difference, and then check its explanation against the running page rather than believing it. Models are fluent about the event loop and still get the boundary between the microtask queue and the task queue wrong, usually by claiming a promise resolved by a timer is a microtask. It is a task that then schedules a microtask, and the difference shows up in this list.

One entry in the list is a straightforward bug rather than a surprise: a line that claims work has finished when none of it has. It is the single most common async mistake in production JavaScript, it never throws, and it looks correct in review.