Write and execute browser tests using the WebQA JSON DSL
This skill inherits all available tools. When active, it can use any tool Claude has access to.
You are writing browser tests using the WebQA JSON DSL. Use the run_browser_test MCP tool to execute tests.
Each test has a test_name and array of steps. Each step has an action and action-specific parameters.
| Action | Required Params | Optional Params | Description |
|---|---|---|---|
goto | url | Navigate to a URL | |
click | selector | Click an element | |
type | selector, text | Type text into an input field | |
wait_for | selector | timeout (ms) | Wait for element to appear |
wait | duration (ms) | Wait for a fixed time | |
screenshot | name | Capture full page screenshot | |
screenshot_element | selector, name | padding (px, default: 10) | Capture element with padding |
assert_text | selector, text | Assert element contains text | |
assert_visible | selector | Assert element is visible | |
hover | selector | Hover over an element | |
select | selector, value | Select a dropdown option | |
press | key | Press a keyboard key |
{ "action": "goto", "url": "http://localhost:3000" }
{ "action": "click", "selector": "#submit-btn" }
{ "action": "type", "selector": "#email", "text": "user@example.com" }
{ "action": "wait_for", "selector": ".success-message", "timeout": 5000 }
{ "action": "wait", "duration": 2000 }
{ "action": "screenshot", "name": "final_state" }
{ "action": "screenshot_element", "selector": ".toast", "name": "toast_message", "padding": 20 }
{ "action": "assert_text", "selector": "h1", "text": "Welcome" }
{ "action": "assert_visible", "selector": ".modal" }
{ "action": "hover", "selector": ".dropdown-trigger" }
{ "action": "select", "selector": "#country", "value": "us" }
{ "action": "press", "key": "Enter" }
#submit-btn[data-testid="login"].btn-primaryform#login button[type="submit"]input[name="email"]{
"test_name": "user_signup_flow",
"steps": [
{ "action": "goto", "url": "http://localhost:3000/signup" },
{ "action": "wait", "duration": 1000 },
{ "action": "type", "selector": "#email", "text": "newuser@test.com" },
{ "action": "type", "selector": "#password", "text": "SecurePass123" },
{ "action": "click", "selector": "#terms-checkbox" },
{ "action": "screenshot", "name": "form_filled" },
{ "action": "click", "selector": "button[type='submit']" },
{ "action": "wait_for", "selector": ".welcome-message" },
{ "action": "assert_text", "selector": ".welcome-message", "text": "Welcome" },
{ "action": "screenshot", "name": "signup_complete" }
]
}
wait after goto to let pages with animations load (1-2 seconds)wait_for before interacting with dynamically loaded elementsUse the run_browser_test MCP tool:
test_name: "descriptive_test_name"
steps: [array of step objects]
The tool returns:
success: booleansteps_executed: number of steps runstep_results: array with timing and pass/fail per stepvideo_path: path to recorded .webm videoscreenshots: array of screenshot pathserror: error message if failed