Puppeteer MCP Server

Instructions

Implementation Reference

• index.ts:182-224 (handler)

  Handler for puppeteer_screenshot tool: sets viewport, captures screenshot of page or specified element, stores it in screenshots map, notifies resource change, returns success message and image content or error if failed.

  case "puppeteer_screenshot": {
    const width = args.width ?? 800;
    const height = args.height ?? 600;
    await page.setViewport({ width, height });
  
    const screenshot = await (args.selector
      ? (await page.$(args.selector))?.screenshot({ encoding: "base64" })
      : page.screenshot({ encoding: "base64", fullPage: false }));
  
    if (!screenshot) {
      return {
        content: [
          {
            type: "text",
            text: args.selector
              ? `Element not found: ${args.selector}`
              : "Screenshot failed",
          },
        ],
        isError: true,
      };
    }
  
    screenshots.set(args.name, screenshot as string);
    server.notification({
      method: "notifications/resources/list_changed",
    });
  
    return {
      content: [
        {
          type: "text",
          text: `Screenshot '${args.name}' taken at ${width}x${height}`,
        } as TextContent,
        {
          type: "image",
          data: screenshot,
          mimeType: "image/png",
        } as ImageContent,
      ],
      isError: false,
    };
  }

• index.ts:30-52 (schema)

  Input schema definition for puppeteer_screenshot tool within the TOOLS array, specifying required 'name' and optional 'selector', 'width', 'height' parameters.

  {
    name: "puppeteer_screenshot",
    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",
        },
        width: {
          type: "number",
          description: "Width in pixels (default: 800)",
        },
        height: {
          type: "number",
          description: "Height in pixels (default: 600)",
        },
      },
      required: ["name"],
    },
  },