dzinesco
f777ef760b
- Create detailed README.md with quick start and demo accounts - Add complete UI primitives documentation with examples - Document architecture patterns and design decisions - Update REBUILD_PLAN.md marking Phase 2 as complete - Include component usage guides and testing documentation - Document accessibility compliance and performance considerations Documentation provides complete developer onboarding experience with practical examples and architectural guidance. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
92 lines
2.3 KiB
Markdown
92 lines
2.3 KiB
Markdown
# QA Testing Quick Start Guide
|
|
|
|
## Prerequisites
|
|
1. **Start the development server** (required for all tests):
|
|
```bash
|
|
npm run dev
|
|
```
|
|
Wait for server to start on `http://localhost:5173`
|
|
|
|
2. **Install dependencies** (one-time setup):
|
|
```bash
|
|
npm install
|
|
npx playwright install
|
|
```
|
|
|
|
## Running Tests
|
|
|
|
### Option 1: Complete QA Suite (Recommended)
|
|
```bash
|
|
# Run all tests with comprehensive reporting
|
|
npm run test:qa
|
|
```
|
|
|
|
### Option 2: Critical Tests Only
|
|
```bash
|
|
# Run only authentication and navigation tests
|
|
npm run test:qa:critical
|
|
```
|
|
|
|
### Option 3: Individual Test Suites
|
|
```bash
|
|
npm run test:auth # Login/logout flows
|
|
npm run test:navigation # Menu and routing
|
|
npm run test:theme # Light/dark theme switching
|
|
npm run test:responsive # Mobile/tablet/desktop layouts
|
|
npm run test:components # UI elements and interactions
|
|
```
|
|
|
|
### Option 4: Debug Mode (Visible Browser)
|
|
```bash
|
|
# Watch tests run in real browser windows
|
|
npm run test:qa:headed
|
|
```
|
|
|
|
## Demo Accounts
|
|
Use these credentials when prompted:
|
|
|
|
- **Admin**: `admin@example.com` / `demo123`
|
|
- **Organizer**: `organizer@example.com` / `demo123`
|
|
- **Staff**: `staff@example.com` / `demo123`
|
|
|
|
## Results
|
|
|
|
After tests complete, check:
|
|
|
|
1. **Console Output** - Pass/fail summary
|
|
2. **HTML Report** - Open `./playwright-report/index.html` in browser
|
|
3. **Screenshots** - Visual evidence in `./screenshots/` folder
|
|
4. **QA Summary** - Executive report in `./test-results/qa-report.md`
|
|
|
|
## Success Criteria
|
|
|
|
✅ **Ready for Production**:
|
|
- All critical tests pass (auth + navigation)
|
|
- No console errors during test execution
|
|
- Screenshots show proper styling in light/dark themes
|
|
- Mobile layouts render correctly
|
|
|
|
⚠️ **Needs Review**:
|
|
- Critical tests failing
|
|
- UI elements not rendering as expected
|
|
- Accessibility issues detected
|
|
|
|
## Troubleshooting
|
|
|
|
**"Connection refused" errors**:
|
|
- Ensure `npm run dev` is running in separate terminal
|
|
- Wait for "Local: http://localhost:5173" message
|
|
|
|
**Permission errors**:
|
|
- Run `chmod 755 screenshots` to fix screenshot folder permissions
|
|
|
|
**Browser issues**:
|
|
- Run `npx playwright install --force` to reinstall browsers
|
|
|
|
## Quick Health Check
|
|
```bash
|
|
# 2-minute smoke test (critical functionality only)
|
|
npm run test:qa:critical
|
|
```
|
|
|
|
This validates the most important user flows for premium venue customers. |