playwright-best-practices

Guide Playwright test development in TypeScript across testing scenarios.

2|Updated Apr 9, 2026
One-click install
npx skills add https://github.com/ylxai/hafiportrait-saas --skill playwright-best-practices-ylxai
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-best-practices
Source: https://github.com/ylxai/hafiportrait-saas/tree/main/.agents/skills/playwright-best-practices
Command: npx skills add https://github.com/ylxai/hafiportrait-saas --skill playwright-best-practices-ylxai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires playwright, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill provides comprehensive guidance for writing, debugging, and maintaining Playwright tests in TypeScript, ensuring best practices are followed for various testing scenarios.

Core Features & Use Cases

  • Best Practices Guide: Offers reference documents for E2E, component, API, visual regression, accessibility, security, i18n, Electron, and browser extension testing.
  • Activity-Based Guidance: Provides focused advice based on the user's current task, such as writing tests, debugging issues, or setting up CI/CD.
  • Real-Time Assistance: Assists with specific issues like flaky tests, element not found, timeouts, and unexpected behavior.

Quick Start

To get started, add the skill to your repository with the following command:

npx skills add https://github.com/currents-dev/playwright-best-practices-skill

Frequently Asked Questions about playwright-best-practices

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

FAQPage Schema
What are the best practices for writing Playwright tests in TypeScript?

Playwright best practices in TypeScript provide comprehensive guidance for E2E, component, API, visual regression, and accessibility testing scenarios to ensure robust automated test development, debugging, and maintenance.

How do I debug flaky Playwright tests and resolve unexpected behavior?

To debug flaky Playwright tests, utilize real-time assistance focused on specific issues like element not found, timeouts, and unexpected behavior. This guidance helps diagnose and fix flaky tests by applying targeted debugging best practices during test development.

Does this Playwright testing guidance cover specialized scenarios like Electron and browser extension testing?

Yes, this Playwright testing guidance covers specialized scenarios including Electron and browser extension testing. It also provides reference documents for security, i18n, and visual regression testing to support comprehensive automated test development.

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

The best way to set up CI/CD for Playwright end-to-end testing is using activity-based guidance tailored for CI/CD setup tasks. This provides focused advice for configuring automated testing pipelines alongside writing and debugging tests in TypeScript.

Can I use Playwright for component and API testing alongside E2E testing?

Yes, you can use Playwright for component and API testing alongside E2E testing. The skill offers dedicated reference documents for component and API testing scenarios, ensuring comprehensive coverage across your automated testing workflow in TypeScript.