Skip to main content
Glama

take_snapshot

Capture a structured text snapshot of the current webpage, listing elements with unique identifiers for automation, debugging, and analysis tasks.

Instructions

Take a text snapshot of the currently selected page. The snapshot lists page elements along with a unique identifier (uid). Always use the latest snapshot. Prefer taking a snapshot over taking a screenshot.

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault

No arguments

Implementation Reference

  • Tool registration for 'take_snapshot'. Includes name, description, annotations (DEBUGGING category, read-only), empty input schema, and handler function that instructs the response to include a snapshot.
    export const takeSnapshot = defineTool({ name: 'take_snapshot', description: `Take a text snapshot of the currently selected page. The snapshot lists page elements along with a unique identifier (uid). Always use the latest snapshot. Prefer taking a snapshot over taking a screenshot.`, annotations: { category: ToolCategories.DEBUGGING, readOnlyHint: true, }, schema: {}, handler: async (_request, response) => { response.setIncludeSnapshot(true); }, });
  • Supporting utility in McpContext that creates the actual text snapshot using Puppeteer's accessibility.snapshot(), assigns unique IDs to nodes, and stores it in the context. Triggered when includeSnapshot is set.
    async createTextSnapshot(): Promise<void> { const page = this.getSelectedPage(); const rootNode = await page.accessibility.snapshot({ includeIframes: true, }); if (!rootNode) { return; } const snapshotId = this.#nextSnapshotId++; // Iterate through the whole accessibility node tree and assign node ids that // will be used for the tree serialization and mapping ids back to nodes. let idCounter = 0; const idToNode = new Map<string, TextSnapshotNode>(); const assignIds = (node: SerializedAXNode): TextSnapshotNode => { const nodeWithId: TextSnapshotNode = { ...node, id: `${snapshotId}_${idCounter++}`, children: node.children ? node.children.map(child => assignIds(child)) : [], }; // The AXNode for an option doesn't contain its `value`. // Therefore, set text content of the option as value. if (node.role === 'option') { const optionText = node.name; if (optionText) { nodeWithId.value = optionText.toString(); } } idToNode.set(nodeWithId.id, nodeWithId); return nodeWithId; }; const rootNodeWithId = assignIds(rootNode); this.#textSnapshot = { root: rootNodeWithId, snapshotId: String(snapshotId), idToNode, }; }
  • The tool handler logic, which sets the response to include a snapshot, leading to snapshot capture.
    handler: async (_request, response) => { response.setIncludeSnapshot(true); },

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/SHAY5555-gif/chrome-devtools-mcp'

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