Async, and What Not to Test

Most interface tests are asynchronous, because state updates and effects do not land synchronously. findBy queries wait for an element to appear; waitFor waits for an assertion to pass.

The common flake is asserting immediately after an action and catching the interface mid-update. Wait for the thing you expect, rather than sleeping for an arbitrary number of milliseconds, which is slower and still occasionally wrong.

Do not test the framework, the styling, or the exact markup. That React re-renders on state change is React's problem. That a class name is btn-primary is not behavior. That a heading is inside a particular div is markup you should be free to change.

Do test: that the four states render the right thing, that a form validates and preserves what was typed, that a callback receives the right argument, and that the keyboard path works.