playwright-skill
Automate browser testing with Playwright
Playwright skill automates web testing with visible browser execution. It detects local dev servers, writes test scripts to temporary storage, and handles form filling, screenshots, and responsive design validation without cluttering your project.
Download the skill ZIP
Upload in Claude
Go to Settings → Capabilities → Skills → Upload skill
Toggle on and start using
Test it
Using "playwright-skill". Take a screenshot of http://localhost:3000
Expected outcome:
Playwright skill detects server on port 3000, writes test script to /tmp/playwright-test-screenshot.js, launches visible Chromium browser, navigates to page, captures full-page screenshot to /tmp/screenshot.png, and reports completion with file path.
Using "playwright-skill". Test responsive design at 1920x1080, 768x1024, and 375x667
Expected outcome:
Skill creates test script with three viewport configurations, takes screenshots at each size named desktop.png, tablet.png, mobile.png in /tmp, and summarizes results with file paths and any observed layout shifts.
Using "playwright-skill". Test login with username admin and password test123
Expected outcome:
Script fills login form fields, clicks submit button, waits for navigation, verifies current URL contains dashboard, reports login success or failure with screenshot evidence saved to /tmp.
Security Audit
Low RiskThis is a legitimate Playwright browser automation skill with 293 static findings that are nearly all false positives. The scanner flagged documentation examples in markdown files as code. Actual code review confirms legitimate patterns: npm install for setup, file operations in /tmp, and localhost dev server detection. No credential exfiltration, malicious network calls, or security vulnerabilities detected.
Low Risk Issues (5)
Risk Factors
⚙️ External commands (1)
📁 Filesystem access (2)
🌐 Network access (1)
Quality Score
What You Can Build
Automated regression testing
QA engineers automate repetitive test cases by asking the skill to write and execute Playwright scripts. The skill detects dev servers, runs tests with visible browser, and captures screenshots of failures.
Responsive design validation
Frontend developers verify layouts across breakpoints by requesting multi-viewport screenshots. The skill tests desktop, tablet, and mobile sizes, reporting layout shifts and visual bugs.
End-to-end workflow testing
Full-stack developers test complete user journeys from login to checkout. The skill fills forms, navigates pages, waits for async operations, and validates success states.
Try These Prompts
Take a screenshot of http://localhost:3000
Test login at http://localhost:3001/login with username admin and password test123. Verify redirect to dashboard.
Test http://localhost:3000/products at desktop 1920x1080, tablet 768x1024, and mobile 375x667. Save screenshots and report layout issues.
Go to http://localhost:3000, click the signup button, fill email field with test@example.com, fill password with secure123, submit form, wait for success message, take screenshot.
Best Practices
- Always use detectDevServers helper when testing localhost to find the correct port automatically
- Write test scripts to /tmp directory to avoid cluttering your project with temporary automation files
- Use visible browser mode for debugging by setting headless false, then switch to headless true for CI pipelines
Avoid
- Do not hardcode production URLs or real user credentials in test scripts shared publicly
- Avoid testing external websites without permission or rate limit awareness
- Do not write test files to project directories when /tmp is available and safer