e2e-testing

Implements Playwright E2E test suites with Page Object Model, CI integration, and flaky test handling.

1|Updated Aug 31, 2026
One-click install
npx skills add https://github.com/gagandeepgill/puzzle-game --skill e2e-testing-gagandeepgill
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: e2e-testing
Source: https://github.com/gagandeepgill/puzzle-game/tree/main/.claude/skills/e2e-testing
Command: npx skills add https://github.com/gagandeepgill/puzzle-game --skill e2e-testing-gagandeepgill

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @playwright/test.

What problem does it solve? End-to-end test suites often become slow, flaky, and hard to maintain as applications grow. This Skill provides proven Playwright patterns for structuring tests, managing artifacts, and stabilizing unreliable tests so teams can trust their E2E results in CI. ## Core Features & Use Cases - Page Object Model Patterns: Encapsulate page locators and interactions in reusable classes to keep test files readable and maintainable. - Flaky Test Diagnosis: Identify race conditions, network timing, and animation issues, then apply quarantine, retry, and auto-wait strategies. - CI/CD Integration: Configure GitHub Actions workflows with artifact uploads for HTML reports, screenshots, videos, and traces. - Use Case: A team shipping a web app needs cross-browser coverage. Use this Skill to scaffold a Playwright config with chromium, firefox, webkit, and mobile projects, plus a CI workflow that uploads failure artifacts on every pull request. ## Quick Start Ask the AI to set up a Playwright E2E test suite with Page Object Model structure and a GitHub Actions workflow for your web application.

Frequently Asked Questions about e2e-testing

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

FAQPage Schema
How do I structure Playwright tests with Page Object Model?▼

Create a class per page that exposes locators and action methods, then instantiate it in test files. This keeps selectors in one place so UI changes require updates in a single class rather than across every test.

How to fix flaky Playwright tests in CI?▼

Replace arbitrary waitForTimeout calls with auto-waiting locators and explicit response waits. Use --repeat-each to reproduce flakiness locally, quarantine unstable tests with test.fixme, and enable retries only in CI.

Does Playwright support mobile and cross-browser testing?▼

Yes. Playwright projects let you run the same suite against chromium, firefox, webkit, and device profiles like Pixel 5. Define each target as a project in playwright.config.ts using the devices presets.

How do I capture screenshots and videos on Playwright test failure?▼

Set screenshot to 'only-on-failure', video to 'retain-on-failure', and trace to 'on-first-retry' in the use block of playwright.config.ts. Upload the playwright-report folder as a CI artifact for debugging.

Can Playwright test wallet connections and Web3 flows?▼

Yes. Use context.addInitScript to inject a mock window.ethereum provider before page load, stubbing methods like eth_requestAccounts. This lets tests verify wallet connection UI without a real browser extension.