Automate End-to-End Testing Workflows

This workflow bundle sequences end-to-end testing with Playwright across seven phases. Phase 1, Test Setup, installs Playwright, configures the test framework and directory, and sets up browsers and a base test config. Phase 2, Test Design, identifies critical user flows, designs test scenarios, plans test data, and creates page objects and fixtures. Phase 3, Test Implementation, writes test scripts with assertions, waits, dynamic-content handling, and error handling. Phase 4, Browser Automation, configures headless mode, screenshots, video recording, trace collection, and mobile emulation. Phase 5, Visual Regression, creates baseline images, adds visual assertions, configures diff thresholds, and reviews differences. Phase 6, Cross-Browser Testing, runs tests against Chromium, Firefox, WebKit, and mobile browsers and compares results. Phase 7, CI/CD Integration, creates a CI workflow with parallel execution, artifact storage, reporting, and notifications. Each phase names the specific skills it invokes and gives a copy-paste prompt to trigger that skill.

Use it when setting up E2E testing, automating browser tests, implementing visual regression, testing across browsers, or integrating tests with CI/CD. It does not apply outside end-to-end testing workflow orchestration - a different domain or tool is out of scope. It relates to separate testing-qa, development, and web-performance-optimization workflow bundles.

Inputs: the application under test and its critical user flows. Outputs: a configured Playwright test setup, page objects and fixtures, written test scripts with assertions and error handling, browser-automation config (headless mode, screenshots, video, trace collection, mobile emulation), a visual-regression baseline with configured diff thresholds, cross-browser results across Chromium/Firefox/WebKit and mobile, and a CI workflow running tests in parallel with artifacts, reporting, and notifications. A five-item quality-gate checklist confirms tests passing, adequate coverage, stable visual tests, cross-browser verification, and working CI integration before the workflow is considered complete.

Playwright for browser automation, visual regression, and cross-browser testing; and companion skills it invokes by name at each phase - playwright-skill, e2e-testing-patterns, test-automator, browser-automation, webapp-testing, ui-visual-validator, github-actions-templates, and cicd-automation-workflow-automate - for CI/CD integration.

Use @playwright-skill to set up Playwright testing

Developers and QA engineers setting up or expanding Playwright-based E2E testing who want a phased path from initial setup through visual regression, cross-browser coverage, and CI/CD integration. The bundle is tagged as a granular workflow bundle with a safe risk level, and each phase's copy-paste prompt (for example "Use @playwright-skill to write E2E test scripts" in Phase 3, or "Use @playwright-skill to run cross-browser tests" in Phase 6) is meant to be pasted directly to trigger that phase's named skill rather than reinterpreted.