E2E Test Suite Documentation

Quick Start

# Run the full E2E suite
npm run test:e2e

# With verbose output (shows each test name + timing)
npm run test:e2e:verbose

# Run a single test file
npx jest --config tests/jest.e2e.config.cjs tests/e2e/customers.test.cjs

# Run tests matching a pattern
npx jest --config tests/jest.e2e.config.cjs -t "Protected Leads"

Tests run headless by default (~100s total). Screenshots are saved to /tmp/ea-screenshots/ after every test.

File Structure

What's Tested (23 scenarios)

customers.test.cjs — Customer CRUD

quotes.test.cjs — Quote Lifecycle + Validation

protected-leads.test.cjs — Protected Leads CRUD

invoices-coupons.test.cjs + bulk-delete.test.cjs

Reproducibility

The previous test runner (e2e-crud.cjs) was a single sequential script. It worked, but had several issues that made results unreliable across runs. The Jest suite fixes each of them:

How Authentication Works

Tests bypass real Supabase auth entirely using scripts/playwright-helpers.cjs:

Adding New Tests

Create a new .test.cjs file in tests/e2e/. It will be auto-discovered by Jest.

// tests/e2e/my-feature.test.cjs
const {
  BASE, createBrowser,
  screenshot, waitForLoadingDone,
} = require('./setup.cjs');

let browser, page;

beforeAll(async () => {
  ({ browser, page } = await createBrowser());
});

afterAll(async () => {
  await browser.close();
});

describe('My Feature', () => {
  test('does the thing', async () => {
    await page.goto(`${BASE}/my-page`, {
      waitUntil: 'networkidle',
      timeout: 15000,
    });
    await waitForLoadingDone(page);

    // Screenshot for evidence
    await screenshot(page, 'my-feature-loaded');

    // Assertions
    const heading = page.locator('h1');
    expect(await heading.textContent()).toContain('Expected');
  });
});

Tips

• Always call waitForLoadingDone(page) after navigation — the app has spinners and lazy-loaded data.
• The CustomerSelector component is a text <input>, not a [role="combobox"]. Results appear as button[data-dropdown-item] elements. Use the selectCustomer() helper.
• Quotes, Licenses, and Invoices pages require a customer selection before showing data. Without it, you see an empty state.
• Quote wizard elements may overlap (the customer info card can block radio buttons). Use { force: true } on clicks when needed.
• Take screenshots at every key step, not just on failure. A "passing" test with no evidence is hard to trust.

Known Limitations