v147 · Demo 4 · DOM

Drag Event Simulator

Drag the chip to see the complete event sequence. A live sequence diagram highlights which events fire and when pointercancel interrupts the pointer stream. Toggle "Old behavior" to compare with pre-Chrome 147 output, then replay the last drag frame-by-frame.

Simulate "old behavior" (no pointercancel on dragstart)

Drag source

☰ Drag me

Drop here

Events will appear here — start a drag.

Sequence diagram Chrome 147+

Replay last drag — event-by-event

Complete a drag to enable replay.

references

ChromeStatus — Pointer event suppression on drag start
Pointer Events spec — pointercancel
MDN — pointercancel event
Event Stream Visualiser
Before / After Comparison