browser_hover
Simulate hover interactions on web elements to test accessibility and functionality, ensuring WCAG compliance during automated scans with detailed visual and JSON reports.
Instructions
Hover over element on page
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| 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:191-200 (handler)The handler function for the browser_hover tool. It sets snapshot inclusion, resolves the element locator from the ref, adds the generated hover code to the response, and executes the hover action via waitForCompletion.handle: async (tab, params, response) => { response.setIncludeSnapshot(); const locator = await tab.refLocator(params); response.addCode(`await page.${await generateLocator(locator)}.hover();`); await tab.waitForCompletion(async () => { await locator.hover(); }); },
- src/tools/snapshot.ts:183-189 (schema)The schema definition for the browser_hover tool, specifying name, title, description, input schema (elementSchema), and readOnly type.schema: { name: 'browser_hover', title: 'Hover mouse', description: 'Hover over element on page', inputSchema: elementSchema, type: 'readOnly', },
- src/tools/snapshot.ts:181-201 (registration)The complete definition and registration of the browser_hover tool using defineTabTool, which wraps the tab-specific handler.const hover = defineTabTool({ capability: 'core', schema: { name: 'browser_hover', title: 'Hover mouse', description: 'Hover over element on page', inputSchema: elementSchema, type: 'readOnly', }, handle: async (tab, params, response) => { response.setIncludeSnapshot(); const locator = await tab.refLocator(params); response.addCode(`await page.${await generateLocator(locator)}.hover();`); await tab.waitForCompletion(async () => { await locator.hover(); }); }, });
- src/tools.ts:38-56 (registration)Aggregates all tools from various modules, including ...snapshot which contains browser_hover, into the allTools array used by the MCP backend.export const allTools: Tool<any>[] = [ ...common, ...console, ...dialogs, ...evaluate, ...files, ...form, ...install, ...keyboard, ...navigate, ...network, ...mouse, ...pdf, ...screenshot, ...snapshot, ...tabs, ...wait, ...verify, ];
- src/tools/snapshot.ts:108-111 (schema)The shared elementSchema used as inputSchema for browser_hover, defining element description and ref.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'), });