Playwright Skill
This is your go-to for full browser automation when you need more than a quick debug. It auto-detects running dev servers so you can immediately test localhost apps without configuration, writes all test scripts to /tmp to keep your project clean, and runs with a visible browser by default so you can watch what's happening. Good for testing login flows, filling forms, checking responsive layouts across viewports, or hunting down broken links. The workflow is sensible: detect servers first, write parameterized Playwright code, execute from the skill directory. One nice touch is it emphasizes keeping URLs and credentials configurable rather than hardcoded. If you just need to inspect network requests or poke at the DOM quickly, reach for chrome-devtools instead.
- skills.sh installs
- 297
- GitHub stars
- 7.2K
- last updated
- Aug 21, 2026
Install
$ npx -y skills add tech-leads-club/agent-skills --skill playwright-skill --agent claude-codeInstalls into .claude/skills of the current project.
Files
IMPORTANT - Path Resolution:
This skill can be installed in different locations (plugin system, manual installation, global, or project-specific). Before executing any commands, determine the skill directory based on where you loaded this SKILL.md file, and use that path in all commands below. Replace $SKILL_DIR with the actual discovered path.
Playwright Browser Automation
General-purpose browser automation skill. I'll write custom Playwright code for any automation task you request and execute it via the universal executor.
CRITICAL WORKFLOW - Follow these steps in order:
-
Auto-detect dev servers - For localhost testing, ALWAYS run server detection FIRST:
cd $SKILL_DIR && node -e "require('./lib/helpers').detectDevServers().then(servers => console.log(JSON.stringify(servers)))"- If 1 server found: Use it automatically, inform user
- If multiple servers found: Ask user which one to test
- If no servers found: Ask for URL or offer to help start dev server
-
Write scripts to /tmp - NEVER write test files to skill directory; always use
/tmp/playwright-test-*.js
Sponsors
Agent CaffeineSponsoredClose your lid, come back to finished work
SnugSponsoredThe clipboard manager for the AI eraPromote your product hereReach 125k+ visitors monthly
WaxSponsoredBlock anything with supervision, without erasing your iPhonePromote your product hereReach 125k+ visitors monthly
knobsSponsoredSee your site on any phone, any day, in any languageDetails
- Repository
- github.com/tech-leads-club/agent-skills
- Categories
- Frontend Development, Testing & QA, AI & Agent Building, Debugging, Automation & Workflows, Design & UI/UX
- First seen
- Jun 3, 2026
More from tech-leads-club/agent-skills
All 22- Perf Astro286
- Coupling Analysis282
- Perf Web Optimization278
- Best Practices276
- Jira Assistant261
- Cursor Subagent Creator259
- Accessibility253
- Excalidraw Studio251
- Seo236
- Figma Implement Design234
- Tlc Spec Driven1.3K
- Subagent Creator941
- Technical Design Doc Creator639
- Security Best Practices378
- Domain Analysis368
- Nestjs Modular Monolith344
- Coding Guidelines338
- Mermaid Studio335
- Perf Lighthouse332
- Decomposition Planning Roadmap314
- Docs Writer301
Recommended
More Frontend Development
apple-bento-gridhubeiqiao/apple-bento-gridCreate Apple-inspired bento grid presentation cards for showcasing project stats, timelines, and achievements. Generates self-contained HTML files with zero-gap294skills.sh installs
dashboardnexu-io/open-designAdmin / analytics dashboard in a single HTML file. Fixed left sidebar, top bar with user/search, main grid of KPI cards and one or two charts. Use when the brie290skills.sh installs
wireframemarkdown-viewer/skillsCreate UI wireframes and mockups using drawio XML format with platform-specific UI component libraries. Best for web page layouts, iOS/Android mobile app mockup283skills.sh installssaas-landingnexu-io/open-designSingle-page SaaS landing with hero, features, social proof, pricing, and CTA. Respects the active DESIGN.md color/typography/layout tokens. Trigger keywords: "s277skills.sh installs
design-spec-extractionpedronauck/skillsExtract comprehensive, production-ready JSON design specifications from visual inputs using a 7-pass serial architecture with cross-validation. Use when convert271skills.sh installs
ux-design-systemshoodini/ai-agents-skillsBuild consistent design systems with tokens, components, and theming. Use when creating component libraries, implementing design tokens, building theme systems,270skills.sh installs