Skip to main content
Glama
Xxx00xxX33

Browserbase MCP Server

by Xxx00xxX33

browserbase_screenshot

Capture screenshots of web pages during browser automation to verify page content and location when other tools cannot provide sufficient information.

Instructions

Takes a screenshot of the current page. Use this tool to learn where you are on the page when controlling the browser with Stagehand. Only use this tool when the other tools are not sufficient to get the information you need.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
nameNoThe name of the screenshot

Implementation Reference

  • The `handleScreenshot` function implements the core logic of the browserbase_screenshot tool: captures a screenshot of the active page, converts it to base64, generates a name, stores it in the screenshots resource map, notifies the server of resource changes, and returns both a text message and the image content.
    async function handleScreenshot(
      context: Context,
      params: ScreenshotInput,
    ): Promise<ToolResult> {
      const action = async (): Promise<ToolActionResult> => {
        try {
          const page = await context.getActivePage();
          if (!page) {
            throw new Error("No active page available");
          }
    
          const screenshotBuffer = await page.screenshot({
            fullPage: false,
          });
    
          // Convert buffer to base64 string and store in memory
          const screenshotBase64 = screenshotBuffer.toString("base64");
          const name = params.name
            ? `screenshot-${params.name}-${new Date()
                .toISOString()
                .replace(/:/g, "-")}`
            : `screenshot-${new Date().toISOString().replace(/:/g, "-")}` +
              context.config.browserbaseProjectId;
          screenshots.set(name, screenshotBase64);
    
          // Notify the client that the resources changed
          const serverInstance = context.getServer();
    
          if (serverInstance) {
            serverInstance.notification({
              method: "notifications/resources/list_changed",
            });
          }
    
          return {
            content: [
              {
                type: "text",
                text: `Screenshot taken with name: ${name}`,
              },
              {
                type: "image",
                data: screenshotBase64,
                mimeType: "image/png",
              },
            ],
          };
        } catch (error) {
          const errorMsg = error instanceof Error ? error.message : String(error);
          throw new Error(`Failed to take screenshot: ${errorMsg}`);
        }
      };
    
      return {
        action,
        waitForNetwork: false,
      };
    }
  • Defines the input schema (ScreenshotInputSchema) using Zod with optional 'name' parameter, infers the type, and defines the tool schema (screenshotSchema) including the tool name 'browserbase_screenshot', description, and reference to inputSchema for validation.
    const ScreenshotInputSchema = z.object({
      name: z.string().optional().describe("The name of the screenshot"),
    });
    
    type ScreenshotInput = z.infer<typeof ScreenshotInputSchema>;
    
    const screenshotSchema: ToolSchema<typeof ScreenshotInputSchema> = {
      name: "browserbase_screenshot",
      description:
        "Takes a screenshot of the current page. Use this tool to learn where you are on the page when controlling the browser with Stagehand. Only use this tool when the other tools are not sufficient to get the information you need.",
      inputSchema: ScreenshotInputSchema,
    };
  • Registers the tool by creating the `screenshotTool` object that combines the capability, schema, and handler function, and exports it as default for use in tool collections like src/tools/index.ts.
    const screenshotTool: Tool<typeof ScreenshotInputSchema> = {
      capability: "core",
      schema: screenshotSchema,
      handle: handleScreenshot,
    };
    
    export default screenshotTool;
Behavior3/5

Does the description disclose side effects, auth requirements, rate limits, or destructive behavior?

With no annotations provided, the description carries the full burden of behavioral disclosure. It explains the tool's purpose (visual feedback for browser control) but doesn't address important behavioral aspects like whether it captures the full page or viewport, image format, storage location, or performance implications. It provides some context but leaves significant gaps.

Agents need to know what a tool does to the world before calling it. Descriptions should go beyond structured annotations to explain consequences.

Conciseness5/5

Is the description appropriately sized, front-loaded, and free of redundancy?

The description is perfectly concise with three sentences that each serve distinct purposes: stating the action, explaining the primary use case, and providing usage constraints. There is zero wasted text, and the information is front-loaded with the core functionality.

Shorter descriptions cost fewer tokens and are easier for agents to parse. Every sentence should earn its place.

Completeness4/5

Given the tool's complexity, does the description cover enough for an agent to succeed on first attempt?

For a single-parameter tool with no output schema and no annotations, the description does a good job explaining the tool's purpose and usage context. However, it doesn't address what the tool returns (image data, file path, etc.) or potential limitations, which would be helpful given the lack of structured output documentation.

Complex tools with many parameters or behaviors need more documentation. Simple tools need less. This dimension scales expectations accordingly.

Parameters4/5

Does the description clarify parameter syntax, constraints, interactions, or defaults beyond what the schema provides?

With 100% schema description coverage for the single parameter, the baseline would be 3. However, the description adds value by implicitly explaining why you might want to name screenshots (to track your position during browser control sessions), providing semantic context beyond the schema's technical documentation of the 'name' parameter.

Input schemas describe structure but not intent. Descriptions should explain non-obvious parameter relationships and valid value ranges.

Purpose5/5

Does the description clearly state what the tool does and how it differs from similar tools?

The description clearly states the specific action ('Takes a screenshot') and resource ('of the current page'), distinguishing it from sibling tools like navigation or extraction tools. It provides a concrete verb+resource combination that leaves no ambiguity about what the tool does.

Agents choose between tools based on descriptions. A clear purpose with a specific verb and resource helps agents select the right tool.

Usage Guidelines5/5

Does the description explain when to use this tool, when not to, or what alternatives exist?

The description provides explicit guidance on when to use this tool ('to learn where you are on the page when controlling the browser with Stagehand') and when not to use it ('Only use this tool when the other tools are not sufficient to get the information you need'). This clearly distinguishes it from alternative information-gathering tools in the sibling set.

Agents often have multiple tools that could apply. Explicit usage guidance like "use X instead of Y when Z" prevents misuse.

Install Server

Other Tools

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/Xxx00xxX33/mcp-server-browserbase'

If you have feedback or need assistance with the MCP directory API, please join our Discord server