atman36/ai-vibe-prompts
Overview
This skill provides a comprehensive testing strategy for JavaScript web apps using Vitest for unit and integration tests and Playwright for end-to-end (E2E) tests. It defines coverage targets, test organization, CI integration, and practical best practices to keep tests fast, reliable, and maintainable. Use it to establish a repeatable testing workflow across new and existing projects.
How this skill works
The strategy prescribes a testing pyramid distribution (70% unit, 20% integration, 10% E2E) and config examples for Vitest and Playwright. It includes setup commands, sample tests, coverage thresholds, and CI job examples to run tests and upload reports. It also describes naming conventions, directory layout, mocking guidelines, and debugging tips to make test suites robust and actionable.
When to use it
- Setting up testing for a new project
- Adding or changing features that need verification
- Improving or enforcing test coverage targets
- Investigating flaky tests and test failures
- Automating tests in CI/CD pipelines
Best practices
- Follow the AAA pattern: Arrange, Act, Assert for clarity
- Prefer many fast unit tests; mock external dependencies
- Keep tests focused—ideally one assertion per behavioral test
- Co-locate unit tests next to components and separate E2E in an e2e/ folder
- Use coverage thresholds (minimum 80% lines/functions, 75% branches) and enforce in CI
- Run quick unit tests pre-commit and full suites in CI before deploy
Example use cases
- Write Vitest unit tests for components and utilities with jsdom environment
- Create integration tests that mock APIs to assert component interactions
- Implement Playwright E2E tests for critical user flows like signup, checkout, and auth
- Add GitHub Actions jobs to run coverage, upload reports, and execute Playwright in CI
- Adopt TDD or pragmatic test-after workflows depending on team cadence
FAQ
Aim for minimum 80% lines/functions and 75% branches; raise critical paths to near 100% and business logic to 95%+.
When should I write E2E vs integration tests?
Use integration tests for component interactions and API integration; reserve E2E for critical user journeys and cross-system validation due to higher cost.
How do I reduce flaky tests?
Mock external services, avoid fragile selectors, add retries only where appropriate, and use Playwright traces to debug failures.
4 skills
This skill helps you design and implement a comprehensive Vitest and Playwright testing strategy with clear coverage targets and best practices.
This skill helps you craft distinctive, production-grade frontend interfaces with bold aesthetics and accessible, performant code.
This skill enforces professional Git workflows, ensuring clean commit history, proper branch naming, and effective collaboration through Conventional Commits
This skill systematically analyzes a codebase to reveal structure, dependencies, and architectural patterns, helping plan changes and onboard developers