hackforla / hackforla/VRMS

Epic: Add Playwright E2E tests for frontend visual verification

Open
#2,084 2 comments 0 reactions 0 assignees View on GitHub
complexity: large Epic/Overview feature: Infrastructure role: Front End size: Epic
Dominant language
JavaScript
Stars
61
Forks
101
PR merge metrics
No merged PRs in 30d

Description

### Overview
Add Playwright as the frontend E2E testing framework to verify visual changes and user flows. This complements existing backend integration tests (#1899) and modernizes the outdated Cypress setup from #269.

### Action Items
- [x] Install Playwright and configure for 3 browsers (Chromium, Firefox, WebKit)
- [x] Establish API route mocking pattern for auth and data endpoints
- [x] Write initial tests for ProjectForm (PR #1789 - ValidatedTextField custom validation)
- [ ] Add tests for login page validation
- [ ] Add tests for project edit flow (ManageProjects page)
- [ ] Add tests for user check-in flow
- [ ] Add tests for admin dashboard
- [ ] Add tests for user search/permissions
- [ ] Integrate Playwright into CI pipeline (GitHub Actions)
- [ ] Add visual regression testing (screenshot comparison)
- [ ] Create auth storage state fixture for reusable login across tests
- [ ] Write tests for future PRs with visual changes (e.g., MUI migrations)

### Resources/Instructions
- [Playwright documentation](https://playwright.dev/docs/intro)
- Branch: `trilliumsmith/playwright`
- Test commands:
- `yarn test:e2e` - Run all tests headless
- `yarn test:e2e:ui` - Interactive UI mode
- `yarn test:e2e:headed` - Run with visible browser
- Related issues: #269 (original Cypress spike), #1899 (backend integration tests), #1789 (first PR tested)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.