playwright-best-practices

Guide Playwright test writing, debugging, and maintenance in TypeScript.

Updated Jan 9, 2026
One-click install
npx skills add https://github.com/runecalico-ai/second_edition_spellbook --skill playwright-best-practices-runecalico-ai
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-best-practices
Source: https://github.com/runecalico-ai/second_edition_spellbook/tree/main/.cursor/skills/playwright-best-practices
Command: npx skills add https://github.com/runecalico-ai/second_edition_spellbook --skill playwright-best-practices-runecalico-ai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides specialized guidance for writing, debugging, and maintaining Playwright tests, ensuring adherence to best practices for efficient and reliable end-to-end, component, API, and visual regression testing.

Core Features & Use Cases

  • Comprehensive Guidance: Covers a wide range of Playwright features from basic assertions to advanced patterns like API mocking and CI/CD integration.
  • Activity-Based References: Delivers context-specific advice tailored to your current task, whether writing new tests, debugging failures, or optimizing performance.
  • Use Case: When debugging a flaky test, this Skill provides targeted references on strategies for identifying and fixing race conditions, improving selectors, and managing test state.

Quick Start

Use the playwright-best-practices skill to help me fix this flaky login test.

Frequently Asked Questions about playwright-best-practices

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix flaky Playwright E2E tests in TypeScript?

To resolve flaky Playwright E2E tests, apply targeted strategies for identifying race conditions, improving selectors, and managing test state. This approach ensures robust test execution by resolving timing issues and unreliable element location.

What's the best way to set up Playwright CI/CD pipelines for TypeScript?

Setting up Playwright CI/CD pipelines involves configuring global setup and teardown scripts, managing project dependencies, and optimizing performance budgets. This configuration yields reliable automated test execution and continuous validation across your deployment workflow.

Can I use Playwright for API mocking and authentication flows?

Yes, you can use Playwright for API mocking and authentication flows. It provides specialized guidance for intercepting network requests, simulating GraphQL and WebSockets, and managing authentication states to isolate and accelerate your test runs.

Does Playwright support accessibility and visual regression testing?

Playwright supports accessibility and visual regression testing by offering specialized references for implementing accessibility checks and capturing visual snapshots. This functionality helps verify compliance and detect unintended UI changes during end-to-end test execution.

How do I handle complex scenarios like iframes and geolocation in Playwright?

Handling complex scenarios like iframes and geolocation in Playwright involves using targeted references for frame manipulation, mocking date and time, and overriding permissions. This capability allows precise simulation of multi-tab flows and mobile environments.