e2e-testing

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

1|Updated Oct 11, 2025
One-click install
npx skills add https://github.com/ibytechaos/claude --skill e2e-testing-ibytechaos
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: e2e-testing
Source: https://github.com/ibytechaos/claude/tree/main/plugins/everything-claude-code/skills/e2e-testing
Command: npx skills add https://github.com/ibytechaos/claude --skill e2e-testing-ibytechaos

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @playwright/test.

What problem does it solve? End-to-end tests are often slow, flaky, and hard to maintain. This Skill provides proven Playwright patterns for structuring test suites, stabilizing unreliable tests, and integrating E2E testing into CI/CD pipelines. ## Core Features & Use Cases - Page Object Model Patterns: Encapsulate page interactions in reusable classes with data-testid locators and auto-waiting behavior. - Flaky Test Management: Diagnose race conditions, network timing, and animation issues, plus quarantine strategies using test.fixme and conditional skips. - CI/CD & Artifact Management: GitHub Actions workflow templates, screenshot/trace/video capture, and structured test report generation. - Use Case: When building a web app with critical user flows like login and checkout, use this Skill to generate a complete Playwright test suite with cross-browser projects, retry logic, and failure artifacts uploaded to CI. ## Quick Start Write a Playwright E2E test suite for my login and search flows using the Page Object Model pattern with CI configuration.

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 as readonly properties and actions as async methods, such as goto() and search(). Tests then instantiate the page object in beforeEach hooks and call its methods, keeping selectors centralized and tests readable.

How to fix flaky Playwright tests in CI?

Replace arbitrary waitForTimeout calls with condition-based waits like waitForResponse or locator auto-waiting. Quarantine known flaky tests with test.fixme or conditional test.skip, and identify flakiness by running tests with --repeat-each=10 or --retries=3.

Does Playwright support testing across multiple browsers?

Yes, Playwright projects in the config file run the same tests across Chromium, Firefox, WebKit, and mobile device emulations like Pixel 5. Each project can have its own device settings and viewport configuration.

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

Configure screenshot: 'only-on-failure', video: 'retain-on-failure', and trace: 'on-first-retry' in playwright.config.ts. You can also capture manual screenshots with page.screenshot() and full-page captures with the fullPage option.

How to mock a crypto wallet like MetaMask in Playwright tests?

Use context.addInitScript to inject a mock window.ethereum object before page load, implementing methods like eth_requestAccounts and eth_chainId. This lets tests interact with wallet connection flows without a real browser extension.

When should E2E tests be skipped in production environments?

Skip tests involving real money or irreversible actions, such as trade execution, using test.skip with an environment check like process.env.NODE_ENV === 'production'. Run these tests only against staging environments with test data.