fix: clone node before dragging for better dispaly (#6174)

JinForYoda · bdbch · bdbch · commit e23882d9ca2b · 2025-03-30T01:51:43.000+01:00
* fix: clone node before dragging for better dispaly

* Create shiny-days-rhyme.md

---------

Co-authored-by: bdbch &lt;6538827+bdbch@users.noreply.github.com&gt;
diff --git a/.changeset/shiny-days-rhyme.md b/.changeset/shiny-days-rhyme.md
@@ -0,0 +1,5 @@
+---
+"@tiptap/core": patch
+---
+
+Clone dragged node before dragging to get correct drag preview image
diff --git a/packages/core/src/NodeView.ts b/packages/core/src/NodeView.ts
@@ -98,7 +98,9 @@ export class NodeView<
       y = handleBox.y - domBox.y + offsetY
     }
 
-    event.dataTransfer?.setDragImage(this.dom, x, y)
+    const clonedNode = this.dom.cloneNode(true) as HTMLElement
+
+    event.dataTransfer?.setDragImage(clonedNode, x, y)
 
     const pos = this.getPos()
 

Original file line number	Diff line number	Diff line change
`@@ -98,7 +98,9 @@ export class NodeView<`
`98`	`98`	`y = handleBox.y - domBox.y + offsetY`
`99`	`99`	`}`
`100`	`100`
`101`		`- event.dataTransfer?.setDragImage(this.dom, x, y)`
	`101`	`+ const clonedNode = this.dom.cloneNode(true) as HTMLElement`
	`102`	`+`
	`103`	`+ event.dataTransfer?.setDragImage(clonedNode, x, y)`
`102`	`104`
`103`	`105`	`const pos = this.getPos()`
`104`	`106`