Practice · Timing & Flakiness
Dynamic Loading
Why this is tricky
Two examples that look identical once loaded, but need a different wait strategy. In the first, the target element is in the DOM the whole time, just invisible — waiting for "present" isn't enough, you need "visible." In the second, the element genuinely doesn't exist until the load finishes — waiting for "visible" on a selector that isn't there yet just times out; you need to wait for it to exist first.
1. Hidden until ready
The target text is already in the DOM (inspect it right now) — it's just display:none until the load finishes.
2. Not created until ready
Nothing exists below this line until the load finishes — check the DOM right after clicking Start and you'll find no element at all yet.
Initial state.