Back to Skills

playwright-testing

E2E testing with Playwright - Page Objects, cross-browser, CI/CD

693stars59forksUpdated 6/16/2026

Security Assessment

Medium Risk(65/100)

Detected risks:

Secret Exposure([SKILL.md] PASSWORD=)
Sensitive File Access([SKILL.md] .env)
Security Score65/100

About playwright-testing

The Playwright E2E Testing skill provides comprehensive support for writing, debugging, and maintaining end-to-end tests using Playwright. It addresses the common challenges of browser automation testing including flaky tests, difficult maintenance, and slow execution by leveraging Playwright's modern architecture with auto-waiting, web-first assertions, and parallel execution capabilities. This skill helps teams build reliable test suites that catch bugs before production while maintaining fast feedback loops.

The skill covers essential testing patterns including Page Object Model implementation, authentication handling with global setup, cross-browser testing across Chromium, Firefox, and WebKit, and mobile viewport testing. It emphasizes best practices like user-facing locator strategies (role-based and text-based selectors), proper test isolation, and CI/CD integration with automatic retries and detailed reporting. The skill includes configuration for local development with live reloading and CI environments with optimized parallel execution.

This skill is designed for QA engineers, full-stack developers, and teams implementing automated testing workflows. It's particularly valuable when building web applications that require robust testing across multiple browsers and devices, when transitioning from other testing frameworks like Selenium or Cypress, or when establishing E2E testing practices in CI/CD pipelines. The skill provides practical examples for common scenarios including authentication flows, form interactions, and complex user journeys.

FAQ

When should I use this skill instead of other testing frameworks?

Use this skill when you need reliable cross-browser E2E testing with modern web applications. Playwright excels at handling modern JavaScript frameworks, provides true cross-browser support including WebKit, and offers features like automatic waiting and web-first assertions that reduce flaky tests. It's particularly strong for testing applications that require authentication flows or complex interactions.

How do I handle authentication in my Playwright tests?

The skill demonstrates using global setup projects that run once before all tests, storing authentication state to disk, and reusing it across test files. This approach significantly speeds up test execution by avoiding repeated login flows. Configure a setup project in playwright.config.ts and use storage state to persist authenticated sessions.

What locator strategy should I prioritize?

Prioritize role-based locators (getByRole) and user-facing text locators (getByLabel, getByText) as they mirror how users interact with your application and are resilient to implementation changes. Use test IDs (getByTestId) for dynamic content where user-facing attributes aren't stable. Avoid CSS selectors and never use XPath as they're brittle and break with minor UI changes.

How do I run tests in CI/CD pipelines?

The skill includes CI-optimized configuration with automatic retries, sequential workers to avoid resource contention, and multiple reporter formats including GitHub Actions integration. Use the webServer option to automatically start your application before tests run, and configure BASE_URL environment variable to test against different environments. The setup handles both local development and CI scenarios.

Can I test mobile applications with this skill?

While Playwright is designed for web applications, this skill includes mobile viewport testing using device emulation for responsive web apps. Configure projects with devices like 'Pixel 5' or 'iPhone 12' to test mobile web experiences. For native mobile app testing, you would need different tools like Appium.

Install playwright-testing

Download and extract the skill files to your .claude/skills/ directory.

Quick Setup:

  1. Copy the skill folder to .claude/skills/
  2. Claude will automatically detect and use the skill