Files
chore/.github/skills/playwright-best-practices/SKILL.md
Ryan Kegel a8d7427a95
Some checks failed
Chore App Build, Test, and Push Docker Images / build-and-push (push) Failing after 1m44s
feat: enhance Playwright testing setup with E2E tests, new skills, and improved documentation
- Added E2E test setup in `auth_api.py` with `/e2e-seed` endpoint for database reset and test user creation.
- Integrated Playwright for end-to-end testing in the frontend with necessary dependencies in `package.json` and `package-lock.json`.
- Created Playwright configuration in `playwright.config.ts` to manage test execution and server setup.
- Developed new skills for Playwright best practices, visual regression, smoke test generation, and self-healing tests.
- Implemented new test cases for chore creation in `chores-create.smoke.spec.ts` and `chores-create.spec.ts`.
- Added page object models for `ChildEditPage` and `LandingPage` to streamline test interactions.
- Updated `.gitignore` to exclude Playwright reports and test results.
- Enhanced documentation in `copilot-instructions.md` for testing and E2E setup.
2026-03-07 10:13:21 -05:00

1.0 KiB

name, description
name description
playwright-best-practices Enforces stable, maintainable, and high-performance Playwright test code.

Playwright Best Practices

When generating or refactoring tests, you must adhere to these standards:

  1. User-Visible Locators: Prioritize page.getByRole(), page.getByText(), and page.getByLabel(). Never use fragile CSS selectors (e.g., .btn-primary) or XPath unless no other option exists.
  2. Web-First Assertions: Use the expect(locator).to... pattern (e.g., toBeVisible(), toHaveText()) to leverage Playwright's built-in auto-waiting and retry logic.
  3. Test Isolation: Every test must be independent. Use test.beforeEach for setup (like navigation or login) rather than relying on the state of a previous test.
  4. Avoid Logic in Tests: Keep tests declarative. Use Page Object Models (POM) if the logic for finding an element requires more than one line of code.
  5. Network Reliability: Mock third-party APIs using page.route() to prevent external flakiness.