Testing strategy: Playwright E2E and Vitest unit tests

Borrissol’s test suite is split across two complementary tools: Playwright handles end-to-end browser tests that exercise the real built site in a real browser, and Vitest handles component-level unit tests. The two suites run independently and cover different layers of the codebase — Playwright verifies user-facing behaviour across Desktop and Mobile Chrome, while Vitest targets isolated component logic in src/.

Run commands

npm run test            # Vitest unit tests (run once, then exit)
npm run test:watch      # Vitest in watch mode (re-runs on file save)
npm run test:e2e        # Build + run Playwright E2E tests
npm run test:e2e:ui     # Build + run Playwright with interactive UI mode
npm run test:e2e:report # Show the last Playwright HTML report

E2E tests always run against a production build. The test:e2e and test:e2e:ui scripts call npm run build first — the Playwright suite never exercises the Astro dev server.

Playwright E2E test scope

The Playwright suite (test files in ./tests/) covers the four critical user journeys on the production build:

Area	What is tested
Navigation links	Every nav item links to the correct anchor or page
WhatsApp CTA links	Correct `wa.me` URLs with pre-filled messages in all 4 languages
Language switcher	Switching language preserves the URL hash and lands on the correct locale
Testimonials carousel	Arrow navigation advances and retreats through testimonial cards

Playwright configuration

Playwright is configured in playwright.config.ts. Key settings extracted from the file:

Setting	Value
Test directory	`./tests`
Parallelism	`fullyParallel: true`
Base URL	`http://localhost:4334`
Trace	`on-first-retry`
HTML report	Generated automatically; `open: 'never'` (use `test:e2e:report` to view)

Browser targets — two projects:

Desktop Chrome  →  devices['Desktop Chrome']
Mobile Chrome   →  devices['Pixel 5']

Web server configuration: Playwright spins up npm run preview -- --port 4334 and waits for http://localhost:4334 before running tests. Port 4334 is intentionally different from the Astro dev server (4321) to avoid conflicts during local development.

webServer: {
  command: 'npm run preview -- --port 4334',
  url: 'http://localhost:4334',
  reuseExistingServer: !process.env.CI,
},

CI behaviour:

Setting	Local	CI (`process.env.CI`)
`forbidOnly`	`false`	`true`
`retries`	`0`	`2`
`workers`	unlimited	`1`

Vitest unit test scope

Vitest is configured in vitest.config.ts using getViteConfig from astro/config — this ensures the Vite build context matches the Astro project exactly:

import { getViteConfig } from 'astro/config';

export default getViteConfig(
  { test: { globals: true, include: ['src/**/*.test.ts'] } } as unknown as Parameters<typeof getViteConfig>[0]
);

Setting	Value
Globals	`true` (no need to import `describe`/`it`/`expect` per file)
Test file pattern	`src/*/.test.ts`

Unit tests live alongside their source files in src/. The current suite includes component tests such as Button.test.ts. Add new *.test.ts files anywhere under src/ and Vitest will pick them up automatically.

Important rules for contributors

Do not run tests automatically. Tests (Vitest and Playwright) must only be run when explicitly requested. During the UI build phase, prioritise visual accuracy in the browser over terminal test results.

After every significant UI change, use the dev server for manual verification first: npm run dev → open http://localhost:4321 → confirm the result looks correct. Then, when a full test pass is needed, run the explicit test commands above.

The project’s CLAUDE.md establishes three related rules that apply to contributors and AI agents alike:

No automatic testing — never trigger vitest or playwright test as a side-effect of another task.
Manual verification first — after any significant change, provide the dev server URL and ask the human to confirm visual correctness before running the automated suite.
E2E = production build only — Playwright always needs a built dist/. Never point it at the dev server.

Configuration

Testing & Performance

Testing strategy: Playwright E2E and Vitest unit tests

Run commands

Playwright E2E test scope

Playwright configuration

Vitest unit test scope

Important rules for contributors

​Run commands

​Playwright E2E test scope

​Playwright configuration

​Vitest unit test scope

​Important rules for contributors

Run commands

Playwright E2E test scope

Playwright configuration

Vitest unit test scope

Important rules for contributors