Skip to main content
Glama

browser.drag_drop

Automate drag-and-drop interactions in web browsers by specifying source and target elements or coordinates for testing and automation workflows.

Instructions

Drag from one element or coordinate to another. Provide source_selector OR (source_x, source_y), and target_selector OR (target_x, target_y).

Input Schema

TableJSON Schema
NameRequiredDescriptionDefault
session_idYes
source_selectorNo
source_xNo
source_yNo
target_selectorNo
target_xNo
target_yNo

Implementation Reference

  • The handler implementation for browser.drag_drop in the MCP tool gateway.
    async def _drag_drop(self, payload: DragDropInput) -> dict[str, Any]:
        session = await self.manager.get_session(payload.session_id)
    
        # Resolve source coordinates
        if payload.source_selector:
            box = await session.page.locator(payload.source_selector).first.bounding_box()
            sx = box["x"] + box["width"] / 2 if box else 0
            sy = box["y"] + box["height"] / 2 if box else 0
        elif payload.source_x is not None and payload.source_y is not None:
            sx, sy = payload.source_x, payload.source_y
        else:
            raise ValueError("Provide source_selector or source_x/source_y")
    
        # Resolve target coordinates
        if payload.target_selector:
            box = await session.page.locator(payload.target_selector).first.bounding_box()
            tx = box["x"] + box["width"] / 2 if box else 0
            ty = box["y"] + box["height"] / 2 if box else 0
        elif payload.target_x is not None and payload.target_y is not None:
            tx, ty = payload.target_x, payload.target_y
        else:
            raise ValueError("Provide target_selector or target_x/target_y")
    
        await session.page.mouse.move(sx, sy)
        await session.page.mouse.down()
        await session.page.mouse.move(tx, ty, steps=10)
        await session.page.mouse.up()
        return {"session_id": payload.session_id, "from": {"x": sx, "y": sy}, "to": {"x": tx, "y": ty}}
  • Input model schema for browser.drag_drop tool.
    class DragDropInput(SessionIdInput):
        source_selector: str | None = Field(default=None, max_length=2000)
        source_x: float | None = None
        source_y: float | None = None
        target_selector: str | None = Field(default=None, max_length=2000)
        target_x: float | None = None
        target_y: float | None = None
  • Registration of the browser.drag_drop tool within McpToolGateway.
        name="browser.drag_drop",
        description=(
            "Drag from one element or coordinate to another. "
            "Provide source_selector OR (source_x, source_y), "
            "and target_selector OR (target_x, target_y)."
        ),
        input_model=DragDropInput,
        handler=self._drag_drop,
    ),

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/LvcidPsyche/auto-browser'

If you have feedback or need assistance with the MCP directory API, please join our Discord server