Claude Official Skill: webapp-testing
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots...
Installation avec revue préalable
Cet actif nécessite une revue. Le prompt copié demande un dry-run, affiche les écritures, puis continue seulement après confirmation.
npx -y tokrepo@latest install 8353a203-1f3f-4589-8366-58bca8b78023 --target codexDry-run d'abord, confirmez les écritures, puis lancez cette commande.
What it is
The webapp-testing skill is an official Claude Code skill from Anthropic's skills repository. It provides a toolkit for interacting with and testing local web applications using Python Playwright scripts. The skill supports verifying frontend functionality, debugging UI behavior, and capturing browser screenshots.
This skill is designed for developers using Claude Code who need to validate web application behavior without manually writing test scaffolding. It includes helper scripts like scripts/with_server.py for managing server lifecycle during tests.
How it saves time or tokens
The skill provides a decision tree for choosing the right testing approach (static HTML vs. dynamic apps vs. server-dependent apps), eliminating trial-and-error. Helper scripts handle server startup, waiting for readiness, and cleanup automatically. Instead of writing boilerplate Playwright setup code, Claude Code generates targeted test scripts using the skill's patterns and runs them directly.
How to use
- Install the skill via
claude skill install anthropics/skills/webapp-testingor manually copy the SKILL.md content to.claude/skills/webapp-testing/SKILL.md. - Ask Claude Code to test a specific page or interaction in your web application.
- Claude Code writes a Playwright script following the skill's decision tree, runs it, and reports results with screenshots.
Example
# Example Playwright test generated by the skill
from playwright.sync_api import sync_playwright
def test_login_flow():
with sync_playwright() as p:
browser = p.chromium.launch()
page = browser.new_page()
page.goto('http://localhost:3000/login')
page.fill('[name=email]', 'test@example.com')
page.fill('[name=password]', 'password123')
page.click('button[type=submit]')
assert page.url == 'http://localhost:3000/dashboard'
page.screenshot(path='login-success.png')
browser.close()
Related on TokRepo
- AI tools for testing -- more testing tools and automation skills
- AI tools for coding -- developer productivity tools for Claude Code
Common pitfalls
- Running scripts with
--helpfirst is recommended by the skill to understand available options before reading source code. - The helper scripts can be large and pollute context windows; treat them as black-box utilities rather than reading their source.
- Playwright requires browser binaries installed via
playwright install chromium; missing browsers cause immediate failures.
Questions fréquentes
The skill uses Playwright, which supports Chromium, Firefox, and WebKit. Chromium is the default. You install browser binaries via `playwright install`. The skill generates Python scripts that can target any Playwright-supported browser.
The skill is designed for interactive testing during development with Claude Code. However, the Playwright scripts it generates are standard Python scripts that can be extracted and run in CI pipelines with pytest or directly via Python.
Yes. The skill's decision tree routes dynamic SPAs to full Playwright browser automation. It waits for elements to render, handles client-side routing, and captures screenshots after JavaScript execution completes.
The `scripts/with_server.py` helper starts your development server, waits for it to be ready (by polling the URL), runs the test script, and then shuts down the server. This handles the common pattern of needing a running server for browser tests.
The skill is designed for Claude Code but the SKILL.md content describes patterns that work with any AI coding assistant that supports skill files. The Playwright scripts themselves are standard Python and run anywhere.
Sources citées (3)
- Anthropic Skills GitHub— Official skill from Anthropic's skills repository
- Playwright Documentation— Playwright for browser automation and testing
- Anthropic Claude Code Documentation— Claude Code skill installation
En lien sur TokRepo
Source et remerciements
Created by Anthropic. Licensed under MIT. anthropics/skills
Fil de discussion
Actifs similaires
Claude Official Skill: web-artifacts-builder
Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifact...
Claude Official Skill: frontend-design
Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or appli...
Claude Official Skill: PPTX — PowerPoint Presentations
Claude Code skill for PowerPoint. Create slide decks, add charts, format layouts, import content, and generate presentations from text.
Claude Official Skill: DOCX — Word Document Creation
Claude Code skill for Word documents. Create, read, edit .docx files with formatting, tables, images, headers, and styles.