playwright-js

Automate Playwright browser tests for JavaScript web apps.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/cjennings/rulesets --skill playwright-js
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-js
Source: https://github.com/cjennings/rulesets/tree/main/playwright-js
Command: npx skills add https://github.com/cjennings/rulesets --skill playwright-js

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Browser automation for modern web apps can be tedious, error-prone, and hard to scale; this Playwright-based skill provides auto-detection of dev servers, temporary script generation to /tmp, and a visible browser workflow for interactive debugging.

Core Features & Use Cases

  • Auto-detects running dev servers on common ports and uses them as test targets
  • Writes test scripts to /tmp/playwright-test-*.js to keep your project clean
  • Ships a helper library with safe click/type retries, cookie banner handling, table extraction, dev-server detection, and env-driven header injection
  • Ideal for validating UX, login flows, link checking, and cross-framework apps (React, Next.js, Vue, Svelte, Express, Node)

Quick Start

Provide a task description and I will auto-detect dev servers, generate a /tmp/playwright-test-*.js script, and execute it with the universal executor.

Frequently Asked Questions about playwright-js

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

FAQPage Schema
How do I automate Playwright tests in JavaScript for a React or Next.js app?

Automate Playwright tests in JavaScript by providing a task description; the skill auto-detects running dev servers, generates a temporary test script, and executes browser automation for modern frameworks like React and Next.js.

What is the best way to validate login flows and check links in a web app?

Validating login flows and checking links is handled through a Playwright helper library offering safe click retries, cookie banner handling, and content extraction, generating temporary scripts to test interactive browser workflows.

Does this browser automation approach work with Vue, Svelte, and Express frameworks?

Browser automation works cross-framework, supporting Vue, Svelte, Express, and Node.js environments by auto-detecting dev servers on common ports and using them as test targets for UI flow validation.

How do I inject custom headers into web testing scripts using environment variables?

Inject custom headers into web testing scripts via environment variables, supported natively by the helper library to pass authentication tokens or override requests during browser automation execution.

Why does Playwright test automation leave temporary files in my project directory?

Playwright test automation avoids cluttering your project directory by writing generated test scripts to a temporary path in /tmp rather than saving files directly into your source tree.

Can I debug browser automation workflows interactively during test execution?

Debug browser automation workflows interactively using a visible browser workflow mode, allowing you to observe test execution, diagnose UI flow failures, and inspect page state during script runs.