e2e-playwright

Write Playwright end-to-end tests under e2e/<feature>.spec.ts using page.goto and getByRole.

Updated Feb 4, 2026
One-click install
npx skills add https://github.com/hakushun/ai-dev-starter --skill e2e-playwright-hakushun
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: e2e-playwright
Source: https://github.com/hakushun/ai-dev-starter/tree/main/.cursor/skills/e2e-playwright
Command: npx skills add https://github.com/hakushun/ai-dev-starter --skill e2e-playwright-hakushun

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps you quickly add Playwright-based end-to-end tests to your web applications, enabling automated verification of critical flows.

Core Features & Use Cases

  • Create and organize: Add e2e tests under e2e/<feature>.spec.ts with Playwright APIs like page.goto and page.getByRole.
  • Reliability & maintainability: Use dependable selectors (getByRole, getByText, getByTestId) and waits to stabilize tests across scenarios.
  • Use Case: When you need to verify login, navigation, and UI state consistently, scaffold and run Playwright tests as part of your development workflow.

Quick Start

  • Create a new spec file under e2e/ (e.g., e2e/login.spec.ts).
  • Import Playwright test helpers: import { test, expect } from '@playwright/test';
  • Run tests with pnpm run e2e (the dev server will start automatically as configured).

Frequently Asked Questions about e2e-playwright

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

FAQPage Schema
How do I add Playwright E2E tests to my web application?

To add Playwright E2E tests, create spec files under e2e/<feature>.spec.ts using Playwright APIs like page.goto and page.getByRole to verify login, navigation, and UI behavior. You can execute these tests using the pnpm run e2e command.

What is the best way to organize end-to-end testing files for a feature?

The best way to organize end-to-end testing files is to place them under the e2e/ directory using a feature-based naming convention like e2e/<feature>.spec.ts, ensuring your automated web app tests remain modular and maintainable.

How do I write reliable Playwright tests that do not break on UI changes?

Write reliable Playwright tests by using dependable selectors like getByRole, getByText, and getByTestId instead of CSS selectors. Combined with Playwright's built-in waits, these selectors stabilize end-to-end tests across different UI scenarios.

Do I need a specific package manager to run Playwright E2E tests?

You need a Node.js project setup with Playwright installed to run E2E tests. The skill is configured to execute tests using pnpm run e2e, which automatically starts the dev server and runs your test suite.

Can I test login and navigation flows with Playwright?

Yes, you can test login and navigation flows with Playwright by importing test and expect from @playwright/test. You use page.goto for navigation and expect to assert UI state, consistently verifying critical user journeys.

When do I need end-to-end testing for my web app?

You need end-to-end testing when you must consistently verify critical flows like login, navigation, and UI state. Adding Playwright tests automates this verification as part of your development workflow to catch regressions early.