pilot_responsive
Capture screenshots at mobile, tablet, and desktop viewport sizes to test responsive web design across multiple devices.
Instructions
Take screenshots at mobile (375x812), tablet (768x1024), and desktop (1280x720).
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| output_prefix | No | File path prefix for screenshots |
Implementation Reference
- src/tools/visual.ts:89-119 (handler)The handler for the 'pilot_responsive' tool, which takes screenshots at mobile, tablet, and desktop viewports.
server.tool( 'pilot_responsive', 'Take screenshots at mobile (375x812), tablet (768x1024), and desktop (1280x720).', { output_prefix: z.string().optional().describe('File path prefix for screenshots') }, async ({ output_prefix }) => { await bm.ensureBrowser(); try { const page = bm.getPage(); const prefix = output_prefix || path.join(TEMP_DIR, 'pilot-responsive'); const viewports = [ { name: 'mobile', width: 375, height: 812 }, { name: 'tablet', width: 768, height: 1024 }, { name: 'desktop', width: 1280, height: 720 }, ]; const originalViewport = page.viewportSize(); const results: string[] = []; for (const vp of viewports) { await page.setViewportSize({ width: vp.width, height: vp.height }); const filePath = `${prefix}-${vp.name}.png`; await page.screenshot({ path: filePath, fullPage: true }); results.push(`${vp.name} (${vp.width}x${vp.height}): ${filePath}`); } if (originalViewport) await page.setViewportSize(originalViewport); return { content: [{ type: 'text' as const, text: results.join('\n') }] }; } catch (err) { return { content: [{ type: 'text' as const, text: wrapError(err) }], isError: true }; } }