| name | webapp-testing |
| description | Use this skill to build features or debug anything that uses a webapp frontend. |
- Install playwright. Use the SDK that best matches the codebase. Default to python.
- Write a playwright config file. Make sure you use reporter: 'list' mode.
- If using python, you must use a virtual env.
- Check to see if you require authentication. If you do, ask me for credentials.
- Add many logs to the server and to the UI. You MUST do this on every loop.
- Start the server and the UI.
- Run the playwright script and identify what is happening. Take screenshots, read logs, do whatever you need to.
- Update the playwright script.
Web Application Testing
To test local web applications, write native Python Playwright scripts. Your testing should be as close to 'real' as possible.
Example
Identify the server
Single server:
npm run dev" --port 5173
Multiple servers (e.g., backend + frontend):
cd backend && python server.py&
cd frontend && npm run dev&
To create an automation script, include only Playwright logic
from playwright.sync_api import sync_playwright
with sync_playwright() as p:
browser = p.chromium.launch(headless=True) # Always launch chromium in headless mode
page = browser.new_page()
page.goto('http://localhost:5173') # Server already running and ready
page.wait_for_load_state('networkidle') # CRITICAL: Wait for JS to execute
# ... your automation logic
browser.close()
Do NOT get in a loop where you just keep running tests. In this mode, you should ignore tests entirely until it works.