E2E Testing

packages/e2e/
├── playwright.config.ts
├── tests/
│   └── docs/
│       └── example.spec.ts
└── test-results/

// playwright.config.ts
import { defineConfig, devices } from "@playwright/test"

export default defineConfig({
  testDir: "./tests",
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: process.env.CI ? 3 : 0,
  reporter: process.env.CI ? "html" : "list",
  use: {
    trace: "on-first-retry",
  },
  projects: [
    {
      name: "chromium",
      use: { ...devices["Desktop Chrome"] },
    },
  ],
  webServer: {
    command: "cd ../../apps/docs && npm run start -- -p 5002",
    url: "http://localhost:5002",
    reuseExistingServer: !process.env.CI,
  },
})

import { expect, test } from "@playwright/test"

test("homepage loads successfully", async ({ page }) => {
  const response = await page.goto("http://localhost:5002", {
    waitUntil: "networkidle",
  })
  await expect(response?.status()).toBe(200)
})

test("navigation works", async ({ page }) => {
  await page.goto("http://localhost:5002")
  await page.click('a[href="/docs"]')
  await expect(page).toHaveURL(/.*docs/)
})

# Run E2E tests
pnpm e2e

# Watch mode (with dev server)
pnpm e2e:watch

# Run specific test file
pnpm turbo run e2e -- tests/docs/example.spec.ts

// pages/home.ts
import { Page } from "@playwright/test"

export class HomePage {
  constructor(private page: Page) {}

  async goto() {
    await this.page.goto("http://localhost:5002")
  }

  async clickDocs() {
    await this.page.click('a[href="/docs"]')
  }
}

// tests/navigation.spec.ts
import { test, expect } from "@playwright/test"
import { HomePage } from "../pages/home"

test("navigate to docs", async ({ page }) => {
  const home = new HomePage(page)
  await home.goto()
  await home.clickDocs()
  await expect(page).toHaveURL(/.*docs/)
})