Tool Directory / Testing

Build a test suite you will actually keep running

Most test suites die of slowness or flakiness, not of bad intentions. The tools below are picked for the property that matters most in practice: a run fast and reliable enough that nobody starts skipping it. Coverage percentage is a vanity metric by comparison.

Reviewed August 2026. Back to the tool directory.

What this layer decides

You are choosing two tools, not five. A unit runner for logic that can be tested in isolation, and an end-to-end runner for the handful of flows where a break means lost revenue. Everything else is optional.

The trap is the middle layer. Component tests that mount a tree, mock four modules, and assert on rendered markup are the ones that break on every refactor while catching almost nothing. Push that logic down into pure functions the unit runner can check, and cover the rendered result once in a browser test.

Unit and integration runners

Vitest

4.x - the current default

Shares your Vite config, so TypeScript, path aliases, and plugins work in tests without a second toolchain. Jest-compatible expect and mock APIs make migration mostly mechanical. Version 4 matured browser mode, running tests in real Chromium, Firefox, or WebKit through Playwright instead of simulating a DOM in Node. Fastest mainstream runner and the highest satisfaction scores in the ecosystem. vitest.dev

Jest

Still huge, no longer the pick

Maintained by Meta and still the most-installed JavaScript test runner by a wide margin, with a decade of plugins, snapshot tooling, and Stack Overflow answers behind it. It is not going away and existing suites are fine. But ESM support remains awkward, it needs its own transform pipeline, and satisfaction has slipped below the level where teams stay out of enthusiasm. jestjs.io

Browser and end-to-end testing

Playwright

The end-to-end winner, decisively

Microsoft-backed, free, and driving Chromium, Firefox, and WebKit from one API with automatic waiting that removes most flakiness at the source. Parallel execution by default, trace viewer that replays a failed run step by step, and codegen that writes a first draft by recording you. It overtook Cypress on downloads and holds a satisfaction lead of roughly twenty points. playwright.dev

Cypress

Maintained, losing ground

Still actively developed and the interactive test runner is genuinely lovely for debugging. But the architecture forces tests to run inside the browser, which complicates multi-tab and multi-origin scenarios, and parallelization historically pushed you toward the paid dashboard. Existing suites do not need to migrate; new projects should start on Playwright. cypress.io

Supporting tools worth knowing

Storybook

Version 10 went ESM-only and cut install size substantially. It is a component workbench first and a test tool second - the real value is a shared catalog designers and developers both open. Heavy for a small project; close to essential once several teams share one component library.

Testing Library

Not a runner - a set of queries that find elements the way a user would, by role and label rather than by class name. Pairs with Vitest or Jest and quietly improves your accessibility because tests fail when the semantics are wrong.

MSW

Mock Service Worker intercepts network requests at the transport layer, so the same handlers serve unit tests, browser tests, and local development. Far more durable than mocking your HTTP client module, because it survives swapping that client.

Our pick

Vitest for logic, Playwright for the flows that pay you

Two tools, and no apologies for the short list. Vitest runs your unit and integration tests using the Vite config you already maintain, so there is no second build pipeline to keep in sync. Playwright covers the handful of journeys that must never break - sign up, log in, checkout, the one report your biggest customer opens every morning.

Add MSW when tests start needing a fake API, and Storybook only once more than one team consumes your components. Skip mounting-and-mocking component tests almost entirely: they cost more in refactor churn than they return in caught bugs. Ten reliable Playwright specs beat two hundred brittle ones, every single time.

Keep going

TypeScript cheatsheet

The type system catches a whole class of bugs before any test runs.

Grab the cheatsheet

Git cheatsheet

Hooks and bisect, the two commands that pair with a test suite.

Grab the cheatsheet

Monitoring layer

Because production will still find what your tests missed.

Browse the layer

SaaS stack guide

Where a test suite earns its keep across a whole product.

See the stack

Test tooling follows your framework - see frontend frameworks for what integrates with Vitest out of the box, and CSS and UI toolkits for the component layer Storybook documents.