Autocomplete
Five patterns, each a different real-world autocomplete: a plain single-select, one that highlights the matched substring inside each suggestion, a free-form multi-tag input with no suggestion list at all, a debounced search that simulates a real network round-trip — complete with a loading state and a "no results" state — and one where the actual task is counting the results, not picking one. In every case, suggestion nodes don't exist in the DOM until you start typing; a locator written against the page's initial state won't find them.
Fully keyboard operable: type to filter, ↓/↑ to move through suggestions, Enter to select, Escape to close.
1. Technology search
2. Country search (matched text highlighted)
3. Multi-tag input
Type and press Enter or comma to add a tag. Click × to remove.
0 tags added
4. Async search (debounced, simulated network delay)
5. Count the matches
Type into the box, then count how many suggestions appear and enter that number.