What are the seven phases of the E2E Testing Workflow?

The workflow breaks down E2E testing into seven structured phases: test setup, test design, test implementation, browser automation, visual regression testing, cross-browser testing, and CI/CD integration.

What does this workflow help you set up?

This workflow guides you through implementing end-to-end testing using Playwright, including installing Playwright, configuring test frameworks, designing test scenarios, writing test scripts, setting up visual testing, configuring cross-browser tests, and creating CI workflows.

What quality gates does the workflow include?

The workflow includes quality gates to verify that tests are passing, coverage is adequate, visual tests are stable, cross-browser compatibility is verified, and CI integration is working.

When should you NOT use this workflow?

Do not use this workflow as a substitute for environment-specific validation, testing, or expert review. Stop and ask for clarification if required inputs, permissions, safety boundaries, or success criteria are missing.

Skill

Automate End-to-End Testing Workflows

Name: E2E Testing Workflow
Availability: OnlineOnly
Author: Antigravity

A 7-phase Playwright E2E testing workflow spanning setup, design, browser automation, visual regression, and CI/CD integration.

Get skill

Works with playwright github

Antigravity

Own this? Claim it

Spark score

out of 100

Updated last month

Version 13.5.0

Add to Favorites

Why it matters

Implement a comprehensive end-to-end testing workflow that automates browser interactions, visual regression, and cross-browser compatibility, seamlessly integrating with CI/CD pipelines.

Outcomes

What it gets done

Set up Playwright for automated browser testing.

Design and implement test scenarios with page objects.

Configure visual regression and cross-browser testing.

Integrate E2E tests into CI/CD pipelines.

Install

Add it to your toolbox

Run in your project directory:

curl -fsSL https://spark.entire.vc/get/ag-e2e-testing | bash

Overview

E2E Testing Workflow

A 7-phase Playwright E2E testing workflow covering setup, test design, browser automation, visual regression, cross-browser testing, and CI/CD integration. Use it when standing up a complete E2E testing practice with Playwright, not for a single ad hoc test or an unrelated testing concern.

What it does

E2E Testing Workflow is a specialized, phase-by-phase workflow for end-to-end testing using Playwright, covering browser automation, visual regression testing, cross-browser testing, and CI/CD integration. It runs across seven phases, each invoking specific named sub-skills via copy-paste prompts: Test Setup (playwright-skill and e2e-testing-patterns, installing Playwright and configuring the test framework), Test Design (e2e-testing-patterns and test-automator, identifying critical flows and creating page objects and fixtures), Test Implementation (playwright-skill and webapp-testing, writing scripts with assertions and error handling), Browser Automation (browser-automation and playwright-skill, configuring headless mode, screenshots, video recording, and mobile emulation), Visual Regression (playwright-skill and ui-visual-validator, creating baseline images and configuring diff thresholds), Cross-Browser Testing (Chromium, Firefox, WebKit, and mobile browsers), and CI/CD Integration (github-actions-templates and cicd-automation-workflow-automate, configuring parallel execution, artifacts, and notifications). A representative phase-1 prompt:

Use @playwright-skill to set up Playwright testing

When to use - and when NOT to

Use this workflow when setting up E2E testing, automating browser tests, implementing visual regression, testing across multiple browsers, or integrating tests with CI/CD. Each phase ends with concrete actions - Phase 4's browser-automation step configures headless mode, screenshots, video recording, trace collection, and mobile emulation; Phase 5 creates baseline images and configures visual-diff thresholds before reviewing differences; Phase 6 runs the same suite against Chromium, Firefox, WebKit, and mobile browsers and compares results - and the whole workflow closes on five quality gates: tests passing, adequate coverage, stable visual tests, cross-browser verification, and working CI integration. It's related to, but distinct from, the testing-qa, development, and web-performance-optimization workflow bundles, which cover adjacent but different scope.

Inputs and outputs

Input is a web application needing E2E coverage across setup, design, implementation, browser automation, and CI integration; output is a working Playwright-based E2E suite - configured test framework, page objects and fixtures, implemented test scripts, visual-regression baselines, cross-browser results (Chromium/Firefox/WebKit/mobile), and a CI/CD pipeline running the suite with parallel execution, artifacts, and reporting.

Who it's for

QA and engineering teams standing up a complete Playwright E2E testing practice - not just writing individual tests, but wiring setup, design, visual regression, cross-browser coverage, and CI/CD together - who want a phased checklist with named sub-skills per phase rather than assembling the pipeline ad hoc. Test Design phase work (creating page objects, setting up fixtures, planning test data before any script is written) and Test Implementation phase work (adding assertions, implementing waits, and handling dynamic content and error cases once scripts exist) are treated as genuinely separate steps, not folded together, so that scenario planning happens before code and doesn't get skipped under time pressure.

FAQ

Common questions

Discussion