Webapp Testing
This toolkit enables automated testing of local web applications using Python Playwright scripts, with helper utilities for managing server lifecycles.
Install
/plugin marketplace add anthropics/skillsThen run /plugin to install the skill set that includes it. In Claude.ai and the Claude app, Anthropic skills are built in: turn them on in Settings → Capabilities.
npx skills add anthropics/skills --skill webapp-testinggit clone --depth 1 https://github.com/anthropics/skills.git /tmp/skills
mkdir -p ~/.claude/skills
cp -r /tmp/skills/skills/webapp-testing ~/.claude/skills/webapp-testingPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
What this skill does
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
Trigger phrases
Claude loads this skill automatically when you say things like:
How it works
- Determine application type (static HTML vs dynamic web app)
- Set up server management using with_server.py helper
- Wait for application readiness with page.wait_for_load_state
- Inspect and identify selectors via screenshots or DOM examination
- Execute automation using identified selectors
When to use it
- When testing local web applications
- When automating browser interactions
- When debugging UI behavior
Best practices
- Use reconnaissance-then-action pattern
- Wait for networkidle before interacting with DOM
- Treat helper scripts as black boxes using --help
From the SKILL.md
# Web Application Testing
To test local web applications, write native Python Playwright scripts.
**Helper Scripts Available**:
- `scripts/with_server.py` - Manages server lifecycle (supports multiple servers)
**Always run scripts with `--help` first** to see usage. DO NOT read the source until you try running the script first and find that a customized solution is abslutely necessary. These scripts can be very large and thus pollute your context window. They exist to be called directly as black-box scripts rather than ingested into your context window.
## Decision Tree: Choosing Your Approach
```
User task → Is it static HTML?
├─ Yes → Read HTML file directly to identify selectors
│ ├─ Success → Write Playwright script using selectors
│ └─ Fails/Incomplete → Treat as dynamic (below)
│
└─ No (dynamic webapp) → Is the server already running?
├─ No → Run: python scripts/with_server.py --help
│ Then use the helper + write simplified Playwright script
│
└─ Yes → Reconnaissance-then-action:
1. Navigate and wait for networkidle
2. Take screenshot or inspect DOM
3. Identify selectors from rendered state
4. Execute actions with discovered selectors
```
## Example: Using with_server.py
To start a server, run `--help` first, then use the helper:
**Single server:**Details
- Skill name
webapp-testing- Repository
- anthropics/skills
- Path
skills/webapp-testing/SKILL.md
FAQ
What does the Webapp Testing skill do?
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.
How do I install the Webapp Testing skill?
Claude Code plugin: /plugin marketplace add anthropics/skills. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Related skills
Algorithmic Art
anthropics/skills
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
Brand Guidelines
anthropics/skills
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.
Canvas Design
anthropics/skills
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
Test Driven Development
obra/superpowers
TDD guidance for feature implementation. Follow test-driven development practices with red-green-refactor workflow.
Pict Test Designer
omkamal/pypict-claude-skill
Design comprehensive test cases using PICT (Pairwise Independent Combinatorial Testing) for any piece of requirements or code. Analyzes inputs, generates PICT models with parameters, values, and constraints for valid scenarios using pairwise testing. Outputs the PICT model, markdown table of test cases, and expected results.
Provider Test Patterns
hashicorp/agent-skills
Terraform provider acceptance test patterns using terraform-plugin-testing with the Plugin Framework. Covers test structure, TestCase/TestStep fields, ConfigStateChecks with custom statecheck.StateCheck implementations, plan checks, CompareValue for cross-step assertions, config helpers, import testing with ImportStateKind, sweepers, and scenario patterns (basic, update, disappears, validation, regression), and ephemeral resource testing with the echoprovider package. Use when writing, reviewing, or debugging provider acceptance tests, including questions about statecheck, plancheck, TestCheck
Browse the most popular Claude skills, all testing & qa skills, or write your own with the skills generator.