9b79856827
- Add 'Twilight Velvet' color palette to globals.css with OKLCH values - Update SettingsPage headers, cards, and dialogs to use semantic theme variables - Update HistoryCard, HistoryFeed, and DraftContent to support dark mode - Update ProviderSelector and ProviderList to use custom card background (#2A2A3D) - Add ThemeToggle component with improved visibility - Ensure consistent use of 'bg-card', 'text-foreground', and 'text-muted-foreground'
Test Suite Documentation
This project uses Playwright for End-to-End (E2E) testing.
Setup
-
Install dependencies: ```bash npm install ```
-
Setup environment: ```bash cp .env.example .env
Update .env with local configuration if needed
```
-
Install Playwright browsers: ```bash npx playwright install ```
Running Tests
-
Run all E2E tests: ```bash npm run test:e2e ```
-
Run in UI mode (interactive): ```bash npx playwright test --ui ```
-
Run specific test file: ```bash npx playwright test tests/e2e/example.spec.ts ```
Architecture
We follow a structured pattern for maintainable tests:
tests/e2e/: Contains the actual test files.tests/support/fixtures/: Playwright fixtures. Usetestfrom here, not@playwright/test.tests/support/fixtures/factories/: Data factories for generating test data.
Best Practices
- Use
data-testid: Preferpage.getByTestId('submit-btn')over CSS/XPath selectors. - Atomic Tests: Each test should be independent and run in isolation.
- Use Factories: Don't hardcode data. Use
userFactory.createUser()to get fresh data. - Network First: When testing external APIs, use network interception to avoid flakiness.