Merge pull request #15126 from ckeditor/ck/15087

Fix (clipboard): Fixed dragging from and into a container without other elements. Closes #15087.
ckeditor · Oct 4, 2023 · 898e933 · 898e933
2 parents 4146775 + ac361bc
commit 898e933
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 1 deletion.
diff --git a/packages/ckeditor5-clipboard/src/dragdrop.ts b/packages/ckeditor5-clipboard/src/dragdrop.ts
@@ -553,7 +553,22 @@ export default class DragDrop extends Plugin {
 
 		// Delete moved content.
 		if ( moved && this.isEnabled ) {
-			model.deleteContent( model.createSelection( this._draggedRange ), { doNotAutoparagraph: true } );
+			model.change( writer => {
+				const selection = model.createSelection( this._draggedRange );
+
+				model.deleteContent( selection, { doNotAutoparagraph: true } );
+
+				// Check result selection if it does not require auto-paragraphing of empty container.
+				const selectionParent = selection.getFirstPosition()!.parent as Element;
+
+				if (
+					selectionParent.isEmpty &&
+					!model.schema.checkChild( selectionParent, '$text' ) &&
+					model.schema.checkChild( selectionParent, 'paragraph' )
+				) {
+					writer.insertElement( 'paragraph', selectionParent, 0 );
+				}
+			} );
 		}
 
 		this._draggedRange.detach();

diff --git a/packages/ckeditor5-clipboard/src/dragdroptarget.ts b/packages/ckeditor5-clipboard/src/dragdroptarget.ts
@@ -378,6 +378,10 @@ function findDropTargetRange(
 			let startIndex = 0;
 			let endIndex = childNodes.length;
 
+			if ( endIndex == 0 ) {
+				return model.createRange( model.createPositionAt( modelElement as Element, 'end' ) );
+			}
+
 			while ( startIndex < endIndex - 1 ) {
 				const middleIndex = Math.floor( ( startIndex + endIndex ) / 2 );
 				const side = findElementSide( editor, childNodes[ middleIndex ], clientX, clientY );

diff --git a/packages/ckeditor5-clipboard/tests/dragdroptarget.js b/packages/ckeditor5-clipboard/tests/dragdroptarget.js
@@ -410,6 +410,33 @@ describe( 'Drag and Drop target', () => {
 			) ).to.be.true;
 		} );
 
+		it( 'should find drop position inside empty container element', () => {
+			model.schema.register( 'htmlDiv', { inheritAllFrom: '$container' } );
+			editor.conversion.elementToElement( { model: 'htmlDiv', view: 'div' } );
+
+			setModelData( model,
+				'<htmlDiv></htmlDiv>'
+			);
+
+			const modelElement = root.getChild( 0 );
+			const viewElement = mapper.toViewElement( modelElement );
+			const domNode = domConverter.mapViewToDom( viewElement );
+
+			const { clientX, clientY } = getMockedMousePosition( { domNode } );
+
+			dragDropTarget.updateDropMarker(
+				viewElement,
+				[ view.createRange( view.createPositionAt( viewElement, 0 ) ) ],
+				clientX,
+				clientY,
+				false
+			);
+
+			expect( model.markers.get( 'drop-target' ).getRange().start.isEqual(
+				model.createPositionAt( root.getChild( 0 ), 0 )
+			) ).to.be.true;
+		} );
+
 		it( 'should hide drop target if target is not in editing root', () => {
 			setModelData( model,
 				'<horizontalLine></horizontalLine>'