Setup

Install

Shell

bun add -d @opentf/web-test

Preload the setup module

The setup module compiles JSX in test files and resets the DOM between tests. Register it as a preload so every test file picks it up. Add a bunfig.toml at your package or workspace root:

TOMLbunfig.toml

[test]
preload = ["@opentf/web-test/setup"]

Write your first test

JSXCounter.test.jsx

import { test, expect } from "bun:test";
import { render } from "@opentf/web-test";
import Counter from "./Counter.jsx";

test("renders", () => {
  const { getByRole } = render(Counter);
  expect(getByRole("button")).toBeDefined();
});

Run

Shell

bun test

Automatic cleanup

The setup module calls cleanup() after each test, so mounted components are removed and their effects disposed without per-test boilerplate. Skip the preload only if you want to call cleanup() yourself.

Without the preload

If you can't preload (or use a different runner), import and clean up manually:

JSX

import { afterEach } from "bun:test";
import { cleanup } from "@opentf/web-test";

afterEach(cleanup);

JSX compilation

Test files that import .jsx components rely on the preload to transpile them. Without it, import the already-compiled output instead, or add the setup as a preload.