`act`

Wraps renders and updates in tests so effects flush like in the browser.

Since React 16.9 Spec ↗

Syntax

await act(async () => { ... })

Parameters

Name	Type	Required	Description
`callback`	`function`	Yes	Function performing renders or updates; may be async.

Returns

Promise — A thenable that resolves once pending work has been applied.

Examples

import { act } from 'react';
import { createRoot } from 'react-dom/client';

await act(async () => {
  createRoot(container).render(<App />);
});

await act(async () => {
  button.dispatchEvent(new MouseEvent('click', { bubbles: true }));
});

Notes

Use act only in tests to ensure state updates and effects are processed before assertions, mirroring real browser behavior. Always await it (even for sync work) to flush microtasks. Testing libraries like React Testing Library wrap interactions in act automatically.