| name | playwriter |
| description | Tool for controlling browser via Playwriter extension. |
Setup
- Install Playwriter extension
- Click extension icon on target tab (icon turns green)
Usage
bun {base dir}/scripts/cmd.ts "<code>"
Examples
# Get page URL
bun {base dir}/scripts/cmd.ts "console.log(page.url())"
# Click button
bun {base dir}/scripts/cmd.ts "await page.getByRole('button', { name: 'Submit' }).click()"
# Get page title
bun {base dir}/scripts/cmd.ts "await page.title()"
# Fill form
bun {base dir}/scripts/cmd.ts "await page.getByLabel('Email').fill('test@example.com')"
# Stop daemon
bun {base dir}/scripts/cmd.ts "daemon.stop()"
Context
Variables available in code:
page- Current Playwright pagecontext- Browser contextstate- Persistent object across callsdaemon- Daemon control object ({ stop: () => void })
Output
The script returns logs and the final result. If the result is an object, it's formatted as JSON.
bun {base dir}/scripts/cmd.ts "console.log('fetching...'); return { title: await page.title() }"
Output:
[log] fetching...
{
"title": "Page Title"
}
Debugging
// Enable debugger
const cdp = await page.context().newCDPSession(page);
await cdp.send('Debugger.enable');
await cdp.send('Debugger.setPauseOnExceptions', { state: 'uncaught' });
// Set breakpoint
await cdp.send('Debugger.setBreakpointByUrl', { lineNumber: 42, urlRegex: '.*app\\.js$' });
Network
// Wait for API response
const res = await page.waitForResponse(r => r.url().includes('/api/data'));
console.log(await res.json());
// Monitor requests
page.on('request', r => console.log('REQ:', r.url()));
await page.reload();
page.removeAllListeners('request');