Playwright
End-to-end browser testing with Playwright — setup, CLI automation, Page Object Model patterns, CI/CD integration, migration from Cypress/Selenium, and production debugging. Use when you need reliable browser tests, want to automate browser interactions from the terminal, set up cross-browser CI pipelines, migrate test suites to Playwright, or write maintainable E2E tests with POM/fixture architecture.
MCP get_skill({ skillId: "playwright" })Use this skill with your agent
Create a free account and connect via MCP
--- title: "Playwright" description: "End-to-end browser testing with Playwright — setup, CLI automation, Page Object Model patterns, CI/CD integration, migration from Cypress/Selenium, and production debugging. Use when you need reliable browser tests, want to automate browser interactions from the terminal, set up cross-browser CI pipelines, migrate test suites to Playwright, or write maintainable E2E tests with POM/fixture architecture." author: AgentArmory license: Proprietary --- # Playwright > End-to-end browser testing with Playwright — setup, CLI automation, Page Object Model patterns, CI/CD integration, migration from Cypress/Selenium, and production debugging. Playwright is Microsoft's browser automation framework supporting Chromium, Firefox, and WebKit. This skill covers the full surface: local setup and CLI usage, writing and organizing tests with web-first assertions, structuring code with Page Object Models or fixtures, integrating with all major CI providers, and migrating existing test suites from Cypress, Selenium, or WebDriver. ## Table of Contents - [When to Use](#when-to-use) - [Prerequisites](#prerequisites) - [Methodology Overview](#methodology-overview) - [Phase 1: Setup and CLI Automation](#phase-1-setup-and-cli-automation) - [Phase 2: Test Architecture and Patterns](#phase-2-test-architecture-and-patterns) - [Phase 3: Page Object Model and Fixtures](#phase-3-page-object-model-and-fixtures) - [Phase 4: CI/CD Integration](#phase-4-cicd-integration) - [Phase 5: Migration from Other Frameworks](#phase-5-migration-from-other-frameworks) - [Phase 6: Nonsense Check](#phase-6-nonsense-check) - [Phase 7: Validate Before Shipping](#phase-7-validate-before-shipping) - [Pitfalls](#pitfalls) - [Cross-Skill Hints](#cross-skill-hints) ## When to Use Use this skill when the user wants to: - **Automate a real browser** from the terminal — navigation, form filling, screenshots, data extraction, UI-flow debugging - **Write E2E, API, component, or visual regression tests** with Playwright in TypeScript, JavaScript, or Python - **Set up CI/CD pipelines** for Playwright — GitHub Actions, GitLab CI, CircleCI, Azure DevOps, Jenkins - **Migrate** existing test suites from Cypress, Selenium, or WebDriver to Playwright - **Structure test code** with Page Object Model patterns or fixture-based architecture - **Debug flaky tests** using trace viewer, network mocking, and web-first assertions ## Prerequisites - Node.js 18+ (TypeScript/JavaScript) or Python 3.8+ (Python) - Playwright installed: `npm init playwright@latest` or `pip install pytest-playwright && playwright install` - For CI: a Git provider supporting CI pipelines (GitHub, GitLab, CircleCI, Azure DevOps, Jenkins) - Existing test suite when migrating from Cypress, Selenium, or WebDriver ## Methodology Overview This skill proceeds in 5 phases:
Related Skills
More skills in Software Engineering
Accessibility Standards
Comprehensive web accessibility standards based on WCAG 2.2 AA, with 38+ anti-patterns, legal enforcement context (EAA, ADA Title II), WAI-ARIA patterns, and framework-specific fixes for modern web frameworks and libraries.
Accord
Authoring unified specification packages across Business/Development/Design teams via staged elaboration (L0 Vision → L1 Requirements → L2 Team Detail → L3 Acceptance Criteria). No code. Use when authoring cross-team specs, building L0-L3 packages, or aligning Biz/Dev/Design on a single source of truth.
Acquire Codebase Knowledge
Use this skill when the user explicitly asks to map, document, or onboard into an existing codebase. Trigger for prompts like "map this codebase", "document this architecture", "onboard me to this repo", or "create codebase docs". Do not trigger for routine feature implementation, bug fixes, or narrow code edits unless the user asks for repository-level discovery.
Acreadiness Assess
Run the AgentRC readiness assessment on the current repository and produce a static HTML dashboard at reports/index.html. Wraps `npx github:microsoft/agentrc readiness` and hands off rendering to the @ai-readiness-reporter custom agent. Supports policies (--policy) for org-specific scoring. Use when asked to assess, audit, or score the AI readiness of a repo.
Acreadiness Generate Instructions
Generate tailored AI agent instruction files via AgentRC instructions command. Produces .github/copilot-instructions.md (default, recommended for Copilot in VS Code) plus optional per-area .instructions.md files with applyTo globs for monorepos. Use after running /acreadiness-assess to close gaps in the AI Tooling pillar.
Acreadiness Policy
Help the user pick, write, or apply an AgentRC policy. Policies customise readiness scoring by disabling irrelevant checks, overriding impact/level, setting pass-rate thresholds, or chaining org baselines with team overrides. Use when the user asks about strict mode, AI-only scoring, custom weights, CI gating, or wants org-wide standardisation.