v148 · HTML · Drag and Drop · Pointer Events
State Machine Visualiser
See the pointer-event-to-drag-event state machine. When a drag starts, Chrome 148 sends a pointercancel event to signal the pointer stream has ended — matching the spec. Interact with the drag source and watch the state transitions in real time.
State machine
Current state: idle
Drag me — watch the state machine and log below
Interact with the element above…
Event sequence
Chrome 148 aligns with the spec by sending pointercancel when drag starts.
| Event | When | Chrome 148 | Pre-148 |
|---|---|---|---|
| pointerdown | Mouse/touch pressed | Same | Fired |
| pointermove | Moving before drag threshold | Same | Fired |
| pointercancel | Drag operation starts | NEW — spec correct | Not fired |
| dragstart | Drag operation starts | Same | Fired |
| pointermove (during drag) | During drag | Suppressed (correct) | Still fired |
| pointerup | After drop | Suppressed (correct) | Sometimes fired |
| dragend | Drag ends | Same | Fired |
references
implementation reference
Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗