# 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

```bash
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

```python
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

```javascript
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>
}
```
