playwright_fill
Fill input fields on web pages using a CSS selector and specified value. Integrates with the Playwright MCP Server for browser automation tasks.
Instructions
fill out an input field
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| selector | Yes | CSS selector for input field | |
| value | Yes | Value to fill |
Input Schema (JSON Schema)
{
"properties": {
"selector": {
"description": "CSS selector for input field",
"type": "string"
},
"value": {
"description": "Value to fill",
"type": "string"
}
},
"required": [
"selector",
"value"
],
"type": "object"
}
Implementation Reference
- src/tools/browser/interaction.ts:42-53 (handler)FillTool class: the core handler that executes page.waitForSelector and page.fill for the playwright_fill toolexport class FillTool extends BrowserToolBase { /** * Execute the fill tool */ async execute(args: any, context: ToolContext): Promise<ToolResponse> { return this.safeExecute(context, async (page) => { await page.waitForSelector(args.selector); await page.fill(args.selector, args.value); return createSuccessResponse(`Filled ${args.selector} with: ${args.value}`); }); } }
- src/tools.ts:137-147 (schema)Tool schema definition including name, description, and input schema for validationname: "playwright_fill", description: "fill out an input field", inputSchema: { type: "object", properties: { selector: { type: "string", description: "CSS selector for input field" }, value: { type: "string", description: "Value to fill" }, }, required: ["selector", "value"], }, },
- src/toolHandler.ts:474-475 (registration)Dispatch/registration in main tool handler switch statement calling FillTool.executecase "playwright_fill": return await fillTool.execute(args, context);
- src/toolHandler.ts:292-292 (registration)Initialization of the FillTool instanceif (!fillTool) fillTool = new FillTool(server);
- Code generation helper for translating playwright_fill actions to Playwright test codecase 'playwright_fill': return this.generateFillStep(parameters); case 'playwright_click': return this.generateClickStep(parameters); case 'playwright_screenshot': return this.generateScreenshotStep(parameters); case 'playwright_expect_response': return this.generateExpectResponseStep(parameters); case 'playwright_assert_response': return this.generateAssertResponseStep(parameters); case 'playwright_hover': return this.generateHoverStep(parameters); case 'playwright_select': return this.generateSelectStep(parameters); case 'playwright_custom_user_agent': return this.generateCustomUserAgentStep(parameters); default: console.warn(`Unsupported tool: ${toolName}`); return null; } } private generateNavigateStep(parameters: Record<string, unknown>): string { const { url, waitUntil } = parameters; const options = waitUntil ? `, { waitUntil: '${waitUntil}' }` : ''; return ` // Navigate to URL await page.goto('${url}'${options});`; } private generateFillStep(parameters: Record<string, unknown>): string { const { selector, value } = parameters; return ` // Fill input field await page.fill('${selector}', '${value}');`; }