browser_click
Simulate clicks on web page elements using structured accessibility snapshots. Perform single, double, or right-clicks on specified elements, enabling precise browser automation without screenshots.
Instructions
Perform click on a web page
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| button | No | Button to click, defaults to left | |
| doubleClick | No | Whether to perform a double click instead of a single click | |
| element | Yes | Human-readable element description used to obtain permission to interact with the element | |
| ref | Yes | Exact target element reference from the page snapshot |
Implementation Reference
- src/tools/snapshot.ts:59-80 (handler)The handler function that implements the core logic of the browser_click tool. It resolves the element locator from the tab, generates Playwright code snippets for the click action (supporting double-click and button selection), adds them to the response, and executes the action via tab.waitForCompletion.handle: async (tab, params, response) => { response.setIncludeSnapshot(); const locator = await tab.refLocator(params); const button = params.button; const buttonAttr = button ? `{ button: '${button}' }` : ''; if (params.doubleClick) { response.addCode(`// Double click ${params.element}`); response.addCode(`await page.${await generateLocator(locator)}.dblclick(${buttonAttr});`); } else { response.addCode(`// Click ${params.element}`); response.addCode(`await page.${await generateLocator(locator)}.click(${buttonAttr});`); } await tab.waitForCompletion(async () => { if (params.doubleClick) await locator.dblclick({ button }); else await locator.click({ button }); }); },
- src/tools/snapshot.ts:44-47 (schema)Zod input schema for the browser_click tool, extending elementSchema with optional doubleClick and button parameters.const clickSchema = elementSchema.extend({ doubleClick: z.boolean().optional().describe('Whether to perform a double click instead of a single click'), button: z.enum(['left', 'right', 'middle']).optional().describe('Button to click, defaults to left'), });
- src/tools/snapshot.ts:39-42 (schema)Base Zod schema for element identification (element description and ref), used as foundation for browser_click input schema.export const elementSchema = z.object({ element: z.string().describe('Human-readable element description used to obtain permission to interact with the element'), ref: z.string().describe('Exact target element reference from the page snapshot'), });
- src/tools/snapshot.ts:49-81 (registration)Tool definition and registration using defineTabTool, including schema metadata (name, title, description, type) and handler reference.const click = defineTabTool({ capability: 'core', schema: { name: 'browser_click', title: 'Click', description: 'Perform click on a web page', inputSchema: clickSchema, type: 'destructive', }, handle: async (tab, params, response) => { response.setIncludeSnapshot(); const locator = await tab.refLocator(params); const button = params.button; const buttonAttr = button ? `{ button: '${button}' }` : ''; if (params.doubleClick) { response.addCode(`// Double click ${params.element}`); response.addCode(`await page.${await generateLocator(locator)}.dblclick(${buttonAttr});`); } else { response.addCode(`// Click ${params.element}`); response.addCode(`await page.${await generateLocator(locator)}.click(${buttonAttr});`); } await tab.waitForCompletion(async () => { if (params.doubleClick) await locator.dblclick({ button }); else await locator.click({ button }); }); }, });
- src/tools.ts:36-52 (registration)Global registration of all tools, including the browser_click tool via the snapshot module export, into the allTools array used by the MCP server.export const allTools: Tool<any>[] = [ ...common, ...console, ...dialogs, ...evaluate, ...files, ...install, ...keyboard, ...navigate, ...network, ...mouse, ...pdf, ...screenshot, ...snapshot, ...tabs, ...wait, ];