Playwright MCP Server

Instructions

Implementation Reference

• src/tools/browser/interaction.ts:184-214 (handler)

  DragTool class implements the core logic for 'playwright_drag' tool using Playwright mouse events to drag from source element to target element.

  export class DragTool extends BrowserToolBase {
    /**
     * Execute the drag tool
     */
    async execute(args: any, context: ToolContext): Promise<ToolResponse> {
      return this.safeExecute(context, async (page) => {
        const sourceElement = await page.waitForSelector(args.sourceSelector);
        const targetElement = await page.waitForSelector(args.targetSelector);
        
        const sourceBound = await sourceElement.boundingBox();
        const targetBound = await targetElement.boundingBox();
        
        if (!sourceBound || !targetBound) {
          return createErrorResponse("Could not get element positions for drag operation");
        }
  
        await page.mouse.move(
          sourceBound.x + sourceBound.width / 2,
          sourceBound.y + sourceBound.height / 2
        );
        await page.mouse.down();
        await page.mouse.move(
          targetBound.x + targetBound.width / 2,
          targetBound.y + targetBound.height / 2
        );
        await page.mouse.up();
        
        return createSuccessResponse(`Dragged element from ${args.sourceSelector} to ${args.targetSelector}`);
      });
    }
  }

• src/tools.ts:388-398 (schema)

  Input schema definition for the 'playwright_drag' tool, specifying sourceSelector and targetSelector as required string parameters.

    name: "playwright_drag",
    description: "Drag an element to a target location",
    inputSchema: {
      type: "object",
      properties: {
        sourceSelector: { type: "string", description: "CSS selector for the element to drag" },
        targetSelector: { type: "string", description: "CSS selector for the target location" }
      },
      required: ["sourceSelector", "targetSelector"],
    },
  },

• src/toolHandler.ts:544-545 (registration)

  Dispatch in handleToolCall switch statement routes 'playwright_drag' calls to dragTool.execute.

  case "playwright_drag":
    return await dragTool.execute(args, context);

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

  Instantiation of DragTool instance during tool initialization.

  if (!dragTool) dragTool = new DragTool(server);

• src/tools.ts:469-469 (registration)

  Inclusion of 'playwright_drag' in BROWSER_TOOLS array for conditional browser launching.

  "playwright_drag",