e2e-testing

Write stable end-to-end tests for web apps using Playwright and Cypress.

364|53|Updated May 9, 2026
One-click install
npx skills add https://github.com/cosmicstack-labs/mercury-agent-skills --skill e2e-testing-cosmicstack-labs
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: e2e-testing
Source: https://github.com/cosmicstack-labs/mercury-agent-skills/tree/main/categories/testing-qa/e2e-testing
Command: npx skills add https://github.com/cosmicstack-labs/mercury-agent-skills --skill e2e-testing-cosmicstack-labs

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps teams reduce flaky end-to-end tests by standardizing how they select elements, assert UI outcomes, mock APIs, and run visual and CI checks.

Core Features & Use Cases

  • Selector strategy for stability: Prioritizes accessible selectors like roles and labels before falling back to text, test ids, or raw CSS locators.
  • Consistent test structure: Provides a practical test template for common user flows such as checkout completion.
  • Visual and CI guardrails: Guides screenshot-based visual testing and recommends Playwright execution with artifact upload on failure.

Quick Start

Install and then implement your first checkout-style E2E test using Playwright or Cypress with the recommended selector priority and an end-to-end assertion that confirms the success message is visible.

Frequently Asked Questions about e2e-testing

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I stop flaky end-to-end tests in Playwright and Cypress?

Flaky end-to-end tests are reduced by standardizing selector strategy, prioritizing accessible roles and labels over raw CSS or text locators, and using assertion-based verification for UI outcomes.

What is the best selector strategy for stable E2E tests?

The best selector strategy for stable E2E tests prioritizes accessible roles and labels, falling back to text, test ids, or raw CSS locators only when necessary to ensure deterministic element selection.

How do I add visual screenshot testing to my CI pipeline?

Visual screenshot testing is added to CI pipelines by executing Playwright tests with screenshot verification and configuring artifact upload on failure to capture visual regressions and report errors.

Can I use Cypress for checkout flow regression testing?

Yes, Cypress supports checkout flow regression testing by applying consistent test structures, API mocking, and assertion-based verification to confirm success messages are visible after user flows.

Does Playwright work well for API mocking in end-to-end tests?

Playwright works well for API mocking in end-to-end tests by intercepting network requests, allowing deterministic test execution for checkout flows and UI regression testing without relying on live backend services.