> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify.com/preactjs/preact/llms.txt
> Use this file to discover all available pages before exploring further.

# Test utils overview

> Testing utilities for Preact components

The `preact/test-utils` package provides utilities to help test Preact components in a test environment.

## Installation

<CodeGroup>
  ```bash npm theme={null}
  npm install --save-dev preact
  ```

  ```bash yarn theme={null}
  yarn add --dev preact
  ```

  ```bash pnpm theme={null}
  pnpm add -D preact
  ```
</CodeGroup>

## Importing

```javascript theme={null}
import { setupRerender, act, teardown } from 'preact/test-utils';
```

## Available utilities

The test-utils package exports three main functions:

<CardGroup cols={2}>
  <Card title="setupRerender" icon="rotate" href="/api/test-utils/setup-rerender">
    Set up synchronous rendering for tests
  </Card>

  <Card title="act" icon="play" href="/api/test-utils/setup-scratch">
    Flush effects and renders in tests
  </Card>

  <Card title="teardown" icon="broom" href="/api/test-utils/setup-rerender">
    Clean up test environment
  </Card>
</CardGroup>

## Basic usage

```javascript theme={null}
import { render } from 'preact';
import { setupRerender, act, teardown } from 'preact/test-utils';
import { expect, test, afterEach } from 'vitest';

// Set up synchronous rendering
const rerender = setupRerender();

afterEach(() => {
  // Clean up after each test
  teardown();
});

test('component updates', async () => {
  let container = document.createElement('div');
  
  await act(() => {
    render(<MyComponent />, container);
  });
  
  // Component is rendered and effects are flushed
  expect(container.innerHTML).toBe('<div>Hello</div>');
});
```

## Source reference

Implementation: [test-utils/src/index.js](https://github.com/preactjs/preact/blob/main/test-utils/src/index.js)

Type definitions: [test-utils/src/index.d.ts](https://github.com/preactjs/preact/blob/main/test-utils/src/index.d.ts)

## Related

* [Testing guide](/advanced/testing)
* [setupRerender API](/api/test-utils/setup-rerender)
* [act API](/api/test-utils/setup-scratch)