Web App Testing

A toolkit for interacting with and testing local web applications using Playwright. It supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs. The skill provides helper scripts for managing server lifecycle and emphasizes a reconnaissance-then-action pattern for effective browser automation.

Testing follows a decision tree based on the application type:

For Static HTML:

• Read the HTML file directly to identify selectors
• Write Playwright script using discovered selectors
• If incomplete, treat as dynamic

For Dynamic Web Apps:

1. If server not running - Use scripts/with_server.py to manage server lifecycle:

   python scripts/with_server.py --server "npm run dev" --port 5173 -- python your_test.py
   

   Supports multiple servers (e.g., backend + frontend)

2. Reconnaissance-then-action pattern:

   • Navigate and wait for networkidle (CRITICAL for dynamic apps)
   • Take screenshot or inspect DOM
   • Identify selectors from rendered state
   • Execute actions with discovered selectors

Key Pattern:

page.goto('http://localhost:5173')
page.wait_for_load_state('networkidle')  # Wait for JS to execute
page.screenshot(path='/tmp/inspect.png')  # Inspect first
# Then perform actions