Skip to main content
v3 · stablePortable UI testing for React · Vue · Playwright

Write your UI tests
once. Run them anywhere.

Atomic Testing composes tiny, reusable component drivers into portable test scenes — so the same semantic test runs across frameworks, libraries, and environments. Learn once, test any UI.

$pnpm add @atomic-testing/core @atomic-testing/react-19
byDataTestId()MUIButtonDriverengine.parts
The magic

One test. Every framework.

Switch the runtime tab — notice the scene definition and the test body never change. Only the import and mount line differ.

welcome.test.ts
import { createTestEngine } from '@atomic-testing/react-19';
import { HTMLButtonDriver, HTMLComponentDriver } from '@atomic-testing/component-driver-html';
import { byDataTestId } from '@atomic-testing/core';

// One scene definition — reused on every runtime
const scene = {
greeting: { locator: byDataTestId('greeting'), driver: HTMLComponentDriver },
button: { locator: byDataTestId('welcome-btn'), driver: HTMLButtonDriver },
};

it('welcomes the user on click', async () => {
const engine = createTestEngine(<Welcome name="Alice" />, scene);

expect(await engine.parts.greeting.getText()).toBe('Hello Alice!');
await engine.parts.button.click();
expect(await engine.parts.button.getText()).toBe('Welcome!');

await engine.cleanUp();
});
✓ identical scene & assertions— your testing knowledge transfers completely.
Composable by design

Small atoms. Infinite tests.

Each primitive is tiny and replaceable. Compose them like atoms into molecules — locators and drivers snap into scenes, scenes into engines, engines into suites that outlive any framework.

Locator
byDataTestId('btn')
Finds the element — by test id, role, text or CSS.
Driver
MUIButtonDriver
Semantic API — .click(), .getText().
Scene → Engine
engine.parts.btn
Orchestrates the whole test, any runtime.
Result
✓ Passing everywhere
React · Vue · Playwright · DOM.

Why teams adopt it

Write once, test everywhere

The same test code works across React, Vue, Playwright and DOM testing. Learn once, test any UI framework.

High-level semantic APIs

select.selectByLabel('Option 2') instead of brittle DOM queries. Focus on behavior, not implementation.

Framework-agnostic drivers

Reuse component drivers across Material-UI, Bootstrap and custom components. Component library changes don’t break your tests.

Future-proof architecture

Framework migrations, library upgrades and environment changes become trivial. Your testing investment scales with your app.

What just happened?

Four building blocks orchestrate every test.

01
ScenePart

Declare which components matter to the test.

02
Locators

Find components with byDataTestId() & friends.

03
Drivers

Use semantic APIs instead of DOM manipulation.

04
TestEngine

Orchestrates everything together, in any runtime.

Test once. Ship with confidence.

Get your first portable test running in five minutes.