Agent skill · software engineering · erichowens
webapp-testing
Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing
Why this skill is useful
Adds specific Playwright patterns and scripts for effective E2E testing of web applications that the AI wouldn't reliably generate on its own.
What it needs
Requires playwright installed locally. About 3k tokens when loaded. Last updated 2026-07-14. 180 stars on the source repository.
What this skill does
Web Application Testing Write native Python Playwright scripts to test local web applications. When to Use ✅ Use for: E2E testing of web applications UI automation and interaction testing Visual regression testing Browser log capture and debugging Screenshot capture for verification Form submission and validation testing ❌ NOT for: API-only testing without a browser (use requests/httpx) Unit testing of individual functions Mobile app testing (use Appium) Load/performance testing (use k6/Locust) Decision Tree: Choosing Your Approach Core Playwright Patterns Basic Test Structure Reconnaissance-Then-Action Pattern Step 1: Inspect rendered DOM Step 2: Identify selectors from inspection results Step 3: Execute actions using discovered selectors Selector Strategy (Priority Order) 1. Role-based (best for accessibility): 2. Text-based (readable, but fragile to copy changes): 3. Test IDs (stable, explicit): 4. CSS selectors (last resort): Common Anti-Patterns Anti-Pattern: Not Waiting for Network Idle Symptom: Tests pass locally, fail in CI; elements not found Problem: Modern SPAs load content dynamically after initial page load Solution: Anti-Pattern: Hardcoded Waits Symptom: time.sleep(3) scattered throughout tests Problem: Slow, unreliable, doesn't adapt to actual page state Solution: Anti-Pattern: Inspecting DOM Before JavaScript Executes Symptom: Empty page content, missing elements in static analysis Problem: Reading HTML before client-side rendering completes Solution: Always wait for networkidle on dynamic apps before inspection Waiting Strategies Screenshot Patterns Console Log Capture Form Testing Assertions Multi-Page Scenarios Test File Organization Running Tests Best Practices 1. Use syncplaywright() for synchronous scripts 2. Always close the browser when done 3. Use descriptive selectors: role, text, test-id over CSS 4. Add appropriate waits: waitforselector(), waitforloadstate() 5. Capture screenshots on failure for debugging 6. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills erichowens/webapp-testing