browser_take_screenshot

Capture screenshots of web pages or specific elements for documentation, testing, or analysis using browser automation.

Instructions

Take a screenshot of the current page or a specific element

Input Schema

TableJSON Schema

Name	Required	Description	Default
`fullPage`	No
`selector`	No

Implementation Reference

src/server.ts:73-106 (handler)

The main execution handler for browser_take_screenshot tool. Parses input, ensures browser connection, takes screenshot of the full page or specified selector, encodes to base64, and returns as text content.

async (params: any) => {
  try {
    const input = z.object({
      fullPage: z.boolean().optional().default(false),
      selector: z.string().optional()
    }).parse(params);
    await this.playwright.ensureConnected();
    
    const page = this.playwright.getPage();
    let screenshot: Buffer;
    
    if (input.selector) {
      const element = await page.locator(input.selector);
      screenshot = await element.screenshot();
    } else {
      screenshot = await page.screenshot({ fullPage: input.fullPage });
    }
    
    return {
      content: [{
        type: 'text',
        text: `Screenshot taken (${screenshot.length} bytes), base64: ${screenshot.toString('base64')}`
      }]
    };
  } catch (error) {
    return {
      content: [{
        type: 'text',
        text: `Screenshot failed: ${error instanceof Error ? error.message : String(error)}`
      }],
      isError: true
    };
  }
}

src/types.ts:18-21 (schema)
Zod schema defining the input parameters for the browser_take_screenshot tool: optional fullPage boolean and selector string.
```
export const BrowserTakeScreenshotInputSchema = z.object({
  fullPage: z.boolean().optional().default(false),
  selector: z.string().optional()
});
```

src/server.ts:64-72 (registration)

Registers the browser_take_screenshot tool with the MCP server, providing name, title, description, and input schema.

'browser_take_screenshot',
{
  title: 'Take Screenshot',
  description: 'Take a screenshot of the current page or a specific element',
  inputSchema: {
    fullPage: z.boolean().optional().default(false),
    selector: z.string().optional()
  }
},

src/playwright.ts:111-117 (helper)

Helper method in PlaywrightManager that ensures the browser is connected and page is ready before executing the screenshot.

async ensureConnected(): Promise<void> {
  const connected = await this.isConnected();
  if (!connected) {
    await this.cleanup();
    await this.connect();
  }
}

Playwright MCP Server