dragAndDrop
Automate drag-and-drop actions in web browsers by specifying source and target elements. Simplify interactions for web testing and scraping with PlayMCP Browser Automation Server.
Instructions
Drag and drop from one element to another
Input Schema
TableJSON Schema
| Name | Required | Description | Default |
|---|---|---|---|
| sourceSelector | Yes | ||
| targetSelector | Yes |
Implementation Reference
- src/controllers/playwright.ts:635-649 (handler)The core handler function that executes the drag and drop logic using Playwright locators to drag from source to target element.async dragAndDrop(sourceSelector: string, targetSelector: string): Promise<void> { try { if (!this.isInitialized() || !this.state.page) { throw new Error('Browser not initialized'); } this.log('Performing drag and drop', { sourceSelector, targetSelector }); const sourceLocator = this.state.page.locator(sourceSelector); const targetLocator = this.state.page.locator(targetSelector); await sourceLocator.dragTo(targetLocator); this.log('Drag and drop complete'); } catch (error: any) { console.error('Drag and drop error:', error); throw new BrowserError('Failed to drag and drop', 'Check if both selectors exist and are interactable'); } }
- src/server.ts:282-293 (schema)Defines the Tool object including name, description, and inputSchema for validating dragAndDrop tool parameters.const DRAG_AND_DROP_TOOL: Tool = { name: "dragAndDrop", description: "Drag and drop from one element to another", inputSchema: { type: "object", properties: { sourceSelector: { type: "string" }, targetSelector: { type: "string" } }, required: ["sourceSelector", "targetSelector"] } };
- src/server.ts:537-537 (registration)Registers the dragAndDrop tool in the tools object map used by the MCP server's capabilities.dragAndDrop: DRAG_AND_DROP_TOOL,
- src/server.ts:808-819 (registration)Dispatcher in callTool handler that routes dragAndDrop calls to the playwrightController, with input validation and response formatting.case 'dragAndDrop': { if (!args.sourceSelector || !args.targetSelector) { return { content: [{ type: "text", text: "Source and target selectors are required" }], isError: true }; } await playwrightController.dragAndDrop(args.sourceSelector as string, args.targetSelector as string); return { content: [{ type: "text", text: "Drag and drop completed successfully" }] }; }