Testing Mastery

Platform-agnostic testing strategy covering Web, Backend, Desktop, and Mobile applications. Core principles apply across all platforms.

Note: Desktop (Tauri/Electron) and Mobile (React Native/Flutter) testing guides coming soon.

Platform Coverage

Testing Pyramid (70-20-10)

Quick Start

# Unit tests
npx vitest run                           # Run all
npx vitest run --coverage                # With coverage
npx vitest --ui                          # Visual UI

# E2E tests
npx playwright test                      # Run all
npx playwright test --ui                 # Interactive UI
npx playwright test --headed             # See browser
npx playwright codegen https://myapp.com # Record test

# Load test
k6 run load-test.js

# Accessibility
npx @axe-core/cli https://myapp.com
npx lighthouse https://myapp.com --output=html

Reference Navigation

Frontend Testing

• Unit & Integration Testing — Vitest patterns, mocking, MSW, test organization
• E2E Testing with Playwright — Page objects, selectors, assertions, parallelism, debugging
• Component Testing — React Testing Library, render patterns, user events

Backend Testing (Multi-stack)

• Backend Unit Testing — Rust (cargo test), Go, Python (pytest), Node (Jest/Vitest)
• API Integration Testing — HTTP endpoint testing, database integration, test containers
• Database Testing — Migration tests, fixtures, transaction rollback patterns

Performance & Load

• Load Testing with k6 — Scenarios, thresholds, custom metrics, CI integration
• Performance Testing — Core Web Vitals, Lighthouse CI, bundle analysis
• API Load Testing — Backend stress testing, concurrency, benchmarking

Security & Accessibility

• Security Testing — OWASP Top 10, SQL injection, XSS, CSRF, auth bypasses
• Accessibility Testing — WCAG 2.1, axe-core, keyboard nav, screen readers

Quality & Strategy

• Visual Regression — Screenshot comparison, responsive snapshots, CI workflow
• Test Strategy Guide — What to test, flakiness mitigation, test data, CI/CD gates
• Cross-Browser & Mobile — Browser matrix, device testing, responsive verification

CI/CD Integration

Frontend Pipeline

jobs:
  test-frontend:
    steps:
      - run: npm run test:unit        # Gate 1: Fast fail (<30s)
      - run: npm run test:integration # Gate 2: API mocking
      - run: npm run test:e2e         # Gate 3: Critical flows
      - run: npm run test:a11y        # Gate 4: Accessibility
      - run: npx lhci autorun         # Gate 5: Performance

Backend Pipeline (Rust)

jobs:
  test-backend:
    steps:
      - run: cargo test --lib         # Unit tests
      - run: cargo test --test '*'    # Integration tests
      - run: cargo clippy             # Linting

Backend Pipeline (Multi-stack)

# Go
- run: go test ./...
- run: golangci-lint run

# Python
- run: pytest tests/
- run: ruff check .

# Node.js
- run: npm run test
- run: npm run lint

Best Practices

1. Test behavior, not implementation — Test what the user sees, not internal state
2. Arrange-Act-Assert — Clear structure for every test
3. Avoid test interdependence — Each test runs in isolation
4. Use factories, not fixtures — Generate fresh test data
5. Flaky tests = bugs — Fix or quarantine immediately
6. Coverage ≠ Quality — 80% meaningful > 100% shallow

Related Skills