Test Pyramid in Practice

The classic test pyramid — unit, integration, end-to-end — updated for modern SPA and microservice codebases.

The test pyramid is old but not obsolete: many fast, isolated tests at the bottom; a few slow, holistic tests at the top. The 2026 twist is what counts as each layer when your app is a React SPA calling five microservices.

The three layers, updated

• Unit — pure functions, single-component tests with Vitest / Jest + React Testing Library. Milliseconds each. Aim for 70% of your test count.
• Integration — real DB (via testcontainers), real HTTP handlers, but mocked third parties. Seconds each. ~25%.
• End-to-end — Playwright / Cypress driving the actual app against a real backend or a full docker-compose stack. Minutes each. ~5%.

The two anti-patterns

• Ice-cream cone. All your tests are E2E. Slow, flaky, expensive. Common when the team doesn't trust the unit layer.
• Hourglass. Lots of unit + lots of E2E, no integration. Breaks whenever the seams between services move.

Concrete guidance for a React + Node app

Unit

// business logic — no React
import { describe, it, expect } from "vitest";
import { computeTax } from "./tax";
describe("computeTax", () => {
  it("applies VAT", () => expect(computeTax(100, "DE")).toBe(19));
});

Integration

// hit the real handler + real Postgres via testcontainers
const pg = await new PostgreSqlContainer().start();
const res = await request(app).post("/orders").send({ items });
expect(res.status).toBe(201);

E2E

// Playwright — real browser, real user flow
test("checkout", async ({ page }) => {
  await page.goto("/");
  await page.getByRole("button", { name: "Buy" }).click();
  await expect(page.getByText("Thank you")).toBeVisible();
});

How to know your pyramid is broken

• Your CI takes > 15 minutes → too many E2E.
• Prod bugs regularly slip through green tests → not enough integration.
• Refactors require rewriting hundreds of tests → too much mocking, tests coupled to implementation.