testing-e2e

Purpose

This skill enables end-to-end (E2E) testing using tools like Playwright, Cypress, and Selenium for browser automation, visual regression testing, and integration with CI/CD pipelines. It focuses on reliable test automation for web applications.

When to Use

Use this skill for full-stack testing of web apps, such as verifying user flows, UI interactions, or visual changes. Apply it in scenarios like regression testing before deployments, cross-browser compatibility checks, or when debugging UI issues in production-like environments.

Key Capabilities

• Automate browser interactions with Playwright: Supports headless mode, tracing, and visual comparisons via expect.toHaveScreenshot().
• Run Cypress tests: Includes real-time reloading, automatic waiting, and custom commands for assertions.
• Implement Selenium for legacy setups: Use WebDriver to control browsers and handle dynamic content.
• Page Object Model (POM): Structure tests with reusable page classes, e.g., define locators in a separate file.
• Visual regression: Capture and compare screenshots using Playwright's trace viewer or Cypress plugins.
• CI integration: Generate reports and artifacts for tools like GitHub Actions or Jenkins.

Usage Patterns

To set up E2E tests, initialize a project with the chosen tool and write tests in a dedicated directory. Always use environment variables for sensitive data, like $PLAYWRIGHT_BROWSER for browser selection.