browser_screenshot

Instructions

Implementation Reference

• index.ts:220-257 (handler)

  Handler function for browser_screenshot tool: captures screenshot of page or element, encodes to base64, stores it, notifies resource change, returns success message and image content.

  case ToolName.BrowserScreenshot: {
    const fullPage = (args.fullPage === 'true');
  
    const screenshot = await (args.selector ?
      page.locator(args.selector).screenshot() :
      page.screenshot({ fullPage }));
    const base64Screenshot = screenshot.toString('base64');
  
    if (!base64Screenshot) {
      return {
        content: [{
          type: "text",
          text: args.selector ? `Element not found: ${args.selector}` : "Screenshot failed",
        }],
        isError: true,
      };
    }
  
    screenshots.set(args.name, base64Screenshot);
    server.notification({
      method: "notifications/resources/list_changed",
    });
  
    return {
      content: [
        {
          type: "text",
          text: `Screenshot '${args.name}' taken`,
        } as TextContent,
        {
          type: "image",
            data: base64Screenshot,
            mimeType: "image/png",
          } as ImageContent,
        ],
      isError: false,
    };
  }

• index.ts:50-62 (registration)

  Tool registration in TOOLS array, including name, description, and input schema for browser_screenshot.

  {
    name: ToolName.BrowserScreenshot,
    description: "Take a screenshot of the current page or a specific element",
    inputSchema: {
      type: "object",
      properties: {
        name: { type: "string", description: "Name for the screenshot" },
        selector: { type: "string", description: "CSS selector for element to screenshot" },
        fullPage: { type: "boolean", description: "Take a full page screenshot (default: false)", default: false },
      },
      required: ["name"],
    },
  },

• index.ts:53-61 (schema)

  Input schema defining parameters for the browser_screenshot tool: name (required), selector (optional), fullPage (optional boolean).

  inputSchema: {
    type: "object",
    properties: {
      name: { type: "string", description: "Name for the screenshot" },
      selector: { type: "string", description: "CSS selector for element to screenshot" },
      fullPage: { type: "boolean", description: "Take a full page screenshot (default: false)", default: false },
    },
    required: ["name"],
  },

• index.ts:841-842 (registration)

  Registers the list of tools (including browser_screenshot) with the MCP server via ListToolsRequestSchema handler.

    tools: TOOLS,
  }));