Playwright Testing

This handles Playwright test setup with a solid foundation: Page Object Model architecture, role-based locators that prioritize accessibility, and global authentication that saves login state across tests. You get cross-browser configs for desktop and mobile viewports, CI/CD defaults with retries and reporters, and a project structure that separates pages, fixtures, and test data. The locator strategy is smart, favoring getByRole and getByLabel over brittle CSS selectors. Worth using when you're starting E2E testing or refactoring a messy test suite, though you'll still need to adapt the page objects to your actual application.

skills.sh installs: 2.5K
GitHub stars: 702
last updated: Jul 14, 2026

View on GitHub

Install

$ npx -y skills add alinaqi/claude-bootstrap --skill playwright-testing --agent claude-code

Installs into .claude/skills of the current project.

Files

Playwright E2E Testing Skill

For end-to-end testing of web applications with Playwright - cross-browser, fast, reliable.

Sources: Playwright Best Practices | Playwright Docs | Better Stack Guide

Setup

Installation

# New project
npm init playwright@latest

# Existing project
npm install -D @playwright/test
npx playwright install

Configuration

// playwright.config.ts
import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  testDir: './e2e',
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: process.env.CI ? 2 : 0,
  workers: process.env.CI ? 1 : undefined,
  reporter: [
    ['html'],
    ['list'],
    process.env.CI ? ['github'] : ['line'],
  ],

  use: {
    baseURL: process.env.BASE_URL || 'http://localhost:3000',
    trace: 'on-first-retry',
    screenshot: 'only-on-failure',
    video: 'retain-on-failure',
  },

SKILL.md on GitHub