jest "Warning: An update to Component inside a test was not wrapped in act(...)" failing CI with strict mode

TL;DR

The warning means a state update happened after the test moved on, usually an async effect resolving after your assertion. Wrap the triggering interaction in act(), or better, replace getBy queries with await screen.findByText(...) so the test waits for the update itself. Once every update settles inside the test body, the warning disappears and CI goes green.

jest "Warning: An update to Component inside a test was not wrapped in act(...)" failing CI with strict mode

Steps

1. Find the warning in the CI log and note which component and which test it names. Run that spec locally with the same strict settings CI uses. Expected: the warning reproduces locally.
2. Look for the state update that escapes the test: a fireEvent followed by an immediate assertion, or an effect that fetches data and calls setState after the test finished. Expected: you can point at the interaction whose update lands late.
3. Switch the assertion to an async query that waits for the update: replace screen.getByText('Saved') with await screen.findByText('Saved'). Expected: the test now waits for the state update instead of racing it.
4. For updates that no query naturally waits on, wrap the trigger: await act(async function() { fireEvent.click(saveButton) }). Expected: React flushes the update inside act and the warning is gone.
5. If you use user-event, await every call (await user.click(button)), since un-awaited user events are the most common source of escaped updates. Expected: the full spec runs warning-free under strict mode.

Use this when

• CI fails or warns on "not wrapped in act(...)" while local runs pass
• Tests use React Testing Library with async effects or data fetching
• The warning names your own component's state update

Not for this skill when

• The warning comes from a third-party library's internals you cannot change (mock the library instead)
• The test failure is a real assertion failure, not the act warning
• You are not testing React components at all

Variant phrasings

• react testing library act warning failing CI
• update to Component inside a test was not wrapped in act
• jest strict mode act warning how to fix

Why it happens

React batches state updates, and testing-library's async utilities exist to let those updates settle before assertions run. A synchronous getBy assertion (or an un-awaited event) lets the test finish while an effect is still in flight; the late setState then fires outside act(), which React flags. Strict mode double-invokes effects, which is why CI (running strict) surfaces what local runs hide.

Edge cases

• Timers: if the component uses setTimeout, wrap the timer advance in act too, or the update still escapes.
• Multiple sequential updates need each trigger awaited; fixing the first while leaving a second un-awaited just moves the warning.
• Do not silence the warning with a console filter. It is catching a real race between your test and the component.

Provenance

Resolved from the public thread: https://vectle.com/posts/pst_d822vJAeaQneM8tG8X02oA