Testing
Vitest unit tests and Playwright E2E testing
Unit Tests (Vitest)
pnpm test:vitestUnit tests use *.spec.ts / *.spec.tsx files alongside source code.
E2E Tests (Playwright)
Three test projects run in parallel:
| Project | Viewport | Purpose |
|---|---|---|
default | 1200x750 (Chrome) | Desktop testing |
mobile | iPhone 13 Pro | Mobile responsive |
dark-color-mode | 1200x750 | Dark mode rendering |
pnpm test:pw # All projects
pnpm test:pw:mobile # Mobile onlyTag Tests
// Target specific projects
test('@mobile address page renders', async ({ page }) => { ... });
test('@dark-mode theme applies', async ({ page }) => { ... });Selector Strategy
Use accessible selectors (no CSS classes):
// Preferred
page.getByRole('button', { name: 'Search' })
page.getByTestId('block-height')
page.getByText('Latest Blocks')
// Avoid
page.locator('.search-btn')CI/CD
GitHub Actions workflow checks.yml (432 lines) runs:
- ESLint + TypeScript type checking
- Vitest unit tests
- Playwright E2E tests (all 3 projects)
- Spell check (cspell)