Playwright MCP Server

Instructions

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 tool

  export 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 validation

    name: "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.execute

  case "playwright_fill":
    return await fillTool.execute(args, context);

• src/toolHandler.ts:292-292 (registration)

  Initialization of the FillTool instance

  if (!fillTool) fillTool = new FillTool(server);

• src/tools/codegen/generator.ts:69-104 (helper)

  Code generation helper for translating playwright_fill actions to Playwright test code

      case '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}');`;
  }