browser_hover
Hover over web page elements to trigger interactive features like dropdown menus, tooltips, or hover effects during browser automation with Playwright MCP.
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:124-133 (handler)The handler function for the 'browser_hover' tool. It ensures a snapshot is included in the response, resolves the element locator from the provided ref and element description, generates code for hovering over the element in Playwright, and waits for the hover action to complete on the tab.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:116-122 (schema)The schema definition for the 'browser_hover' tool, specifying its name, title, description, input schema (reusing 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:39-42 (schema)Shared Zod schema for element-based tools like browser_hover, defining 'element' (human-readable description) and 'ref' (exact reference from snapshot).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:114-134 (registration)The complete tool registration using defineTabTool, which wraps the tab-specific handler and schema for MCP compatibility.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:27-52 (registration)Top-level aggregation and registration of all tools, importing snapshot.ts (containing browser_hover) and including it in the allTools array used for MCP server registration.import snapshot from './tools/snapshot.js'; import tabs from './tools/tabs.js'; import screenshot from './tools/screenshot.js'; import wait from './tools/wait.js'; import mouse from './tools/mouse.js'; import type { Tool } from './tools/tool.js'; import type { FullConfig } from './config.js'; export const allTools: Tool<any>[] = [ ...common, ...console, ...dialogs, ...evaluate, ...files, ...install, ...keyboard, ...navigate, ...network, ...mouse, ...pdf, ...screenshot, ...snapshot, ...tabs, ...wait, ];