skillfed

playwright-e2e

Automate browser-based testing for web applications with this Playwright-powered skill. Execute comprehensive end-to-end tests that validate real user interactions and workflows across your application, catching issues before production. Ideal for teams building reliable web experiences with automated verification.

playwright-e2e enables you to write end-to-end tests by automating browser interactions and verifying user workflows. You define test cases that simulate real user actions—clicking buttons, filling forms, navigating pages—and assert that your application behaves correctly. playwright-e2e handles browser automation across Chromium, Firefox, and WebKit, allowing you to test your entire application flow in a real browser environment without manual intervention.

AI-generated summary based on this skill's SKILL.md

1 1 MIT updated by 5dive-ai

Install

5dive-ai/skills/playwright-e2e

CLI (skillfed)coming soon
git clone https://github.com/5dive-ai/skills
cp -r skills/playwright-e2e ~/.claude/skills/playwright-e2e

Frequently asked questions

AI-generated answers based on this skill's SKILL.md and metadata

How do I write e2e tests with playwright?

playwright-e2e enables you to write end-to-end tests by automating browser interactions and verifying user workflows. You define test cases that simulate real user actions—clicking buttons, filling forms, navigating pages—and assert that your application behaves correctly. playwright-e2e handles browser automation across Chromium, Firefox, and WebKit, allowing you to test your entire application flow in a real browser environment without manual intervention.

Can playwright-e2e test authenticated pages and login flows?

Yes, playwright-e2e is designed to test authenticated pages and login flows by managing session state and credentials. You can automate login sequences, store authentication tokens or cookies, and reuse them across test sessions to avoid repeated login steps. This capability lets you verify that protected pages render correctly and that user flows work properly after authentication, making it ideal for testing real-world application scenarios.

What is playwright end to end testing used for?

playwright-e2e is used to automate browser-based testing for web applications, validating real user interactions and workflows across your entire application. It catches issues before production by executing comprehensive tests that verify user flows work in actual browsers. Teams use playwright-e2e to ensure reliable web experiences, test complex user journeys, and maintain confidence in application quality as features evolve.

How does playwright-e2e help with debugging UI bugs and test failures?

playwright-e2e provides debugging capabilities including screenshot capture and step-by-step test execution tracing. When tests fail, you can take screenshots at key points to visually inspect the UI state, review detailed execution logs, and replay test steps to identify exactly where things went wrong. This makes it much faster to diagnose UI bugs and verify that your web changes work as expected.

How do I set up playwright-e2e in CI/CD pipelines?

playwright-e2e supports CI/CD pipeline integration with proper configuration and artifact handling. You can configure it to run headless (without a visible browser window), generate test reports, and collect screenshots and videos of test execution. playwright-e2e handles environment setup, manages test parallelization, and produces artifacts that help you track test results and debug failures in your continuous integration workflow.

What selector best practices does playwright-e2e recommend for reliable test scripts?

playwright-e2e promotes using accessible selectors and best practices to write reliable, maintainable test scripts. It encourages selecting elements by role, label, or placeholder text rather than fragile CSS classes or IDs that change frequently. By following these practices, your playwright-e2e tests remain stable as your UI evolves, reducing false failures and making automation more resilient to design changes.

SKILL.md

rendered from the published skill — quoted content, verbatim

Playwright E2E & Click-Verification Guide

Drive a real browser to prove a web change works — not just that it compiles. Use this to verify flows end-to-end, reproduce UI bugs, and screenshot pages. Pairs with nextjs-app.

> Core principle: a green build is not a working feature. Before calling an interactive change > done, click through the actual rendered page in a browser. Especially for authed routes, > modals, and forms — those are exactly where "looks fine in code" silently breaks.

Install

npm install -D @playwright/test
npx playwright install chromium      # or: --with-deps on CI / fresh boxes

Minimal config

```ts // playwright.config.ts import { defineConfig } from

(truncated - see the full file via the links below)

Read as markdown · JSON record · Browse the source repository

File tree — 1 file
playwright-e2e/SKILL.md

Related skills

Tags

ui-automation browser-testing qa-testing test-automation web-verification ci-cd-testing functional-testing visual-testing login-flow-testing cross-browser-testing