browser_drag_drop

Browser Drag Drop

Perform a mouse drag operation from start coordinates to end coordinates. Used for slider CAPTCHAs, puzzle solving, canvas drawing, and custom drag interactions. Uses realistic mouse movement with bezier curves. For HTML5 draggable elements, use browser_html5_drag_drop instead.

Usage Example

CURL

POST `/api/execute/browser_drag_drop`

curl -X POST \
 -H "Authorization: Bearer <token>" \
 -H "Content-Type: application/json" \
 -d '{

"context_id": "ctx_000001",

"start_x": 0,

"start_y": 0,

"end_x": 0,

"end_y": 0

}' \
http://localhost:8080/api/execute/browser_drag_drop

Python SDK

import asyncio

from owl_browser import OwlBrowser, RemoteConfig

# Async usage
async with OwlBrowser(config) as browser:
    context = await browser.create_context()
    context_id = context["context_id"]
    await browser.drag_drop(
        context_id=context_id,
        start_x=0,
        start_y=0,
        end_x=0,
        end_y=0
    )

Node.js SDK

import { OwlBrowser } from '@olib-ai/owl-browser-sdk';

// Async usage
const ctx = await browser.createContext();
const contextId = ctx.context_id;
await browser.dragDrop({
    context_id: contextId,
    start_x: 0,
    start_y: 0,
    end_x: 0,
    end_y: 0
});

Parameters

Required

  • context_id string required
    The unique identifier of the browser context (e.g., 'ctx_000001')
  • start_x number required
    X coordinate (in pixels from left edge) where the drag starts. Use browser_get_bounding_box to find element positions
  • start_y number required
    Y coordinate (in pixels from top edge) where the drag starts
  • end_x number required
    X coordinate (in pixels from left edge) where the drag ends (drop location)
  • end_y number required
    Y coordinate (in pixels from top edge) where the drag ends (drop location)

Optional

  • mid_points string
    Optional array of intermediate [x, y] coordinates for the drag path. Creates a more realistic drag movement through multiple waypoints. Format: [[x1, y1], [x2, y2], ...]. Example: [[300, 200], [400, 250]]

Response

Returns a JSON object with the operation result.

{
  "success": true,
  "result": <value>
}