[Drag and Drop] Fix drag-out snapshots and copy behavior - #3424
[Drag and Drop] Fix drag-out snapshots and copy behavior#3424Julia Roldi (juliaroldi) wants to merge 5 commits into
Conversation
|
There was a problem hiding this comment.
Pull request overview
Adds an undo snapshot when content is dragged out of the editor by hooking blur in DragAndDropPlugin, ensuring drag-out edits become undoable and preventing stale internal-drag state from impacting later drops.
Changes:
- Register a
blurDOM event handler inDragAndDropPlugintotakeSnapshot()when an internal drag is in progress and reset the internal drag flag. - Extend
DragAndDropPluginunit tests to cover blur behavior (snapshot taken/reset flag, no snapshot without internal drag, snapshot only once per drag).
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| packages/roosterjs-content-model-plugins/lib/dragAndDrop/DragAndDropPlugin.ts | Adds blur handling to snapshot and reset internalDrag during drag-out scenarios. |
| packages/roosterjs-content-model-plugins/test/dragAndDrop/DragAndDropPluginTest.ts | Adds unit tests validating snapshot/reset behavior on blur during internal drag. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| if (this.internalDrag) { | ||
| this.editor?.takeSnapshot(); | ||
| this.internalDrag = false; | ||
| } |
|
When drag out of editor and drop, we don't delete from editor, right? Then why do we need to take a snapshot? |
We do not delete if the content is dragged inside the same window. Ex: drag from the editor to the markdown editor, the content is deleted. |
I just tried, yes the content is deleted in that case. But it seems this is done by browser, but not by our code. This may cause some problem since our code does not know something got deleted. I think we need to explore a way that we can know drop is happening and content is being deleted, so we can delete it with our code, and take snapshot, and trigger ContentChanged event |
Summary
Update
DragAndDropPluginto compare the selected content model segments betweendragstartanddragend. When an internal drag removes content outside the editor, emit acontentChangedevent with the newDragOutOfEditorsource and take an undo snapshot; internal drops do not create the extra snapshot.Also preserve the original selection when Ctrl or Command is held during an internal drop so the operation copies content instead of moving it.
How to test
yarn test:fast --testPathPattern=dragAndDrop.HandleDropInternalContent, select editor content, and drag it outside the editor. Verify the removal emits aDragOutOfEditorcontent change and Undo restores the content.