wait_for_element
Wait for specific elements to appear on web pages before interacting with them. Prevents errors when handling dynamic content, page transitions, or elements that load after user actions like clicking buttons.
Instructions
Wait for a specific element to appear on the page before continuing. Essential for handling dynamic content that loads asynchronously, page transitions, or elements that appear after clicking buttons. Prevents errors from trying to interact with elements that haven't loaded yet. Commonly used after login, navigation, or clicking buttons that trigger loading states.
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector of the element to wait for (e.g., '.chat-container', '#message-input', '[data-loaded="true"]') | |
| sessionId | Yes | Session ID obtained from initialize_session | |
| timeout | No | Maximum time in milliseconds to wait before timing out. Increase for slow-loading pages (default: 30000) |
Implementation Reference
- src/tools/interaction.js:109-126 (handler)Core handler function that executes the wait_for_element tool logic using Playwright to wait for the specified CSS selector to appear on the page.export async function waitForElement(sessionId, selector, timeout = 30000) { const session = getSession(sessionId); const { page } = session; try { await page.waitForSelector(selector, { timeout }); return { success: true, sessionId, selector, message: `Element "${selector}" found`, currentUrl: page.url(), }; } catch (error) { throw new Error(`Element "${selector}" not found within ${timeout}ms`); } }
- src/index.js:247-272 (schema)Input schema definition for the wait_for_element tool, including parameters sessionId, selector, and optional timeout, as registered in the MCP listTools handler.{ name: "wait_for_element", description: "Wait for a specific element to appear on the page before continuing. Essential for handling dynamic content that loads asynchronously, page transitions, or elements that appear after clicking buttons. Prevents errors from trying to interact with elements that haven't loaded yet. Commonly used after login, navigation, or clicking buttons that trigger loading states.", inputSchema: { type: "object", properties: { sessionId: { type: "string", description: "Session ID obtained from initialize_session", }, selector: { type: "string", description: "CSS selector of the element to wait for (e.g., '.chat-container', '#message-input', '[data-loaded=\"true\"]')", }, timeout: { type: "number", description: "Maximum time in milliseconds to wait before timing out. Increase for slow-loading pages (default: 30000)", default: 30000, }, }, required: ["sessionId", "selector"], }, },
- src/index.js:513-528 (registration)Registration and dispatching logic in the MCP CallToolRequestSchema handler, which validates parameters and calls the waitForElement function.case "wait_for_element": { const { sessionId, selector, timeout = 30000 } = args; if (!sessionId) { throw new McpError( ErrorCode.InvalidParams, "sessionId parameter is required" ); } if (!selector) { throw new McpError( ErrorCode.InvalidParams, "selector parameter is required" ); } result = await waitForElement(sessionId, selector, timeout); break;
- src/index.js:12-26 (registration)Import statement that brings the waitForElement function into the main server file for use in tool dispatching.reverseEngineerChat, takeScreenshot, clickElement, fillForm, switchTab, waitForElement, navigateToUrl, getCurrentPageInfo, initializeSession, closeSession, startNetworkCapture, stopNetworkCapture, getNetworkCaptureStatus, clearNetworkCapture, } from "./tools/reverseEngineer.js";
- src/tools/reverseEngineer.js:16-16 (helper)Re-export of the waitForElement function from interaction.js, making it available for import in the main index.js file.export { clickElement, fillForm, waitForElement } from "./interaction.js";