production · 26 minute study

Test what the user can do across state changes

A component can render once and still fail keyboard use, async races, error recovery or tenant changes.

Loading progressEvidence grows with practice

Useful preparation · 1 prerequisite

Use this as a map, not a lock. If these ideas are familiar, continue.

Measure work before caching it — Memoization can help expensive repeated work, but often hides a more useful state or component-boundary fix.

First, build a mental model

A useful UI test performs an interaction and observes its intended consequence. Pure logic tests, component tests and browser tests provide different evidence.

Test reducers and validators as pure logic where possible.
Test labels, focus and keyboard behavior through semantic controls.
Test loading/error/retry states and out-of-order async completions.
Remember that Next Client Components can prerender during build; browser APIs belong in client lifecycle/event boundaries.

Read the codetext · educational example

Given: two searchable items and no selection
When: the user focuses Search, types 'Lamp', and presses the result button
Then: the selected item is Lamp and focus remains understandable
Also test: empty result, rejected request, stale response, removed selected item
Do not assert only that the component name occurs in its source.

Arrange
Create a controlled initial state and fake the required external boundary.
Act
Perform the actual user interaction.
Assert
Observe the intended state/UI consequence and failure behavior.

Production thinking

Take this beyond the example.

Preserve exact candidate identity and evidence. Combine focused logic tests with relevant browser workflows; do not equate coverage percentage, source patterns or one screenshot with product correctness.

Sources and further reading

Your evidence

unseen is a local learning signal, not a credential or proof of production competence.

Explain the mental model, then explicitly acknowledge it. Opening a page is not evidence.

Supported retries can complete this lesson. Independent evidence and delayed review determine the skill stage.