set_viewport
Adjust browser viewport dimensions to simulate different screen sizes for responsive design testing and mobile device simulation.
Instructions
Set the browser viewport size (e.g., for mobile simulation)
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| width | Yes | Viewport width in pixels | |
| height | Yes | Viewport height in pixels | |
| mobile | No | Whether to simulate a mobile device |
Implementation Reference
- src/browser.ts:38-42 (handler)The core handler function in BrowserManager class that initializes the page if needed and sets the viewport size using Puppeteer, returning a confirmation message.
async setViewport(width: number, height: number, isMobile: boolean = false) { const page = await this.init(); await page.setViewport({ width, height, isMobile }); return `Viewport set to ${width}x${height} (Mobile: ${isMobile})`; } - src/index.ts:82-94 (schema)The tool schema definition including name, description, and input schema for validation in the TOOLS array.
{ name: "set_viewport", description: "Set the browser viewport size (e.g., for mobile simulation)", inputSchema: { type: "object", properties: { width: { type: "number", description: "Viewport width in pixels" }, height: { type: "number", description: "Viewport height in pixels" }, mobile: { type: "boolean", description: "Whether to simulate a mobile device" }, }, required: ["width", "height"], }, }, - src/index.ts:135-141 (registration)The switch case registration in the CallToolRequestHandler that dispatches the set_viewport tool call to browserManager.setViewport with parsed arguments.
case "set_viewport": result = await browserManager.setViewport( Number(args?.width), Number(args?.height), Boolean(args?.mobile) ); break;