set_viewport_size
Adjust browser viewport dimensions to specific width and height in pixels for responsive testing and layout verification.
Instructions
Set the browser viewport size (width x height in pixels). In some modes (e.g., headless), the actual size may vary slightly.
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| height | Yes | Viewport height in pixels | |
| width | Yes | Viewport width in pixels |
Implementation Reference
- src/tools/utilities.ts:143-164 (handler)The handler function for the set_viewport_size tool. Validates input parameters (width and height), retrieves the Firefox instance, calls setViewportSize on it, and returns a success or error response.export async function handleSetViewportSize(args: unknown): Promise<McpToolResponse> { try { const { width, height } = args as { width: number; height: number }; if (typeof width !== 'number' || width <= 0) { throw new Error('width parameter is required and must be a positive number'); } if (typeof height !== 'number' || height <= 0) { throw new Error('height parameter is required and must be a positive number'); } const { getFirefox } = await import('../index.js'); const firefox = await getFirefox(); await firefox.setViewportSize(width, height); return successResponse(`✅ ${width}x${height}`); } catch (error) { return errorResponse(error as Error); } }
- src/tools/utilities.ts:50-67 (schema)The tool schema definition specifying the name 'set_viewport_size', description, and input schema requiring positive number width and height.export const setViewportSizeTool = { name: 'set_viewport_size', description: 'Set viewport dimensions in pixels.', inputSchema: { type: 'object', properties: { width: { type: 'number', description: 'Width in pixels', }, height: { type: 'number', description: 'Height in pixels', }, }, required: ['width', 'height'], }, };
- src/index.ts:143-147 (registration)Registration of the set_viewport_size handler in the central toolHandlers Map, mapping the tool name to its handler function.['accept_dialog', tools.handleAcceptDialog], ['dismiss_dialog', tools.handleDismissDialog], ['navigate_history', tools.handleNavigateHistory], ['set_viewport_size', tools.handleSetViewportSize], ]);
- src/firefox/pages.ts:37-42 (helper)Core implementation in PageManagement class that uses WebDriver to set the browser window rectangle (viewport size). Called by the Firefox facade./** * Set viewport size */ async setViewportSize(width: number, height: number): Promise<void> { await this.driver.manage().window().setRect({ width, height }); }