highlight_element
Visually identify web page elements by briefly highlighting them with a flash effect to confirm element selection during UI annotation.
Instructions
Briefly flash-highlight a specific element on the page so the user can see which element you are referring to. Useful for confirming "do you mean this element?"
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| name | Yes | The element name or CSS selector to highlight |
Implementation Reference
- src/index.js:100-115 (handler)The 'highlight_element' tool is registered in src/index.js. When called, it invokes the 'proxy.highlight' method to send a command to the browser.
mcp.tool( 'highlight_element', 'Briefly flash-highlight a specific element on the page so the user can see which element you are referring to. Useful for confirming "do you mean this element?"', { name: z.string().describe('The element name or CSS selector to highlight'), }, async ({ name }) => { proxy.highlight(name); return { content: [{ type: 'text', text: `Highlighted "${name}" on the page. The user should see a brief red flash around the element.`, }], }; } ); - src/proxy.js:177-177 (helper)The 'highlight' method in proxy.js adds a 'highlight' command to the 'pendingCommands' queue, which the browser polls for via the '/__annotator/commands' endpoint.
highlight: (name) => { pendingCommands.push({ type: 'highlight', name }); },