diff --git a/packages/block-editor/src/components/inserter-draggable-blocks/index.js b/packages/block-editor/src/components/inserter-draggable-blocks/index.js index 5a63535be3d3ce..0e1aaadc72e67b 100644 --- a/packages/block-editor/src/components/inserter-draggable-blocks/index.js +++ b/packages/block-editor/src/components/inserter-draggable-blocks/index.js @@ -29,6 +29,15 @@ const InserterDraggableBlocks = ( { blocks, }; + const blocksContainMedia = + blocks.filter( + ( block ) => + ( block.name === 'core/image' || + block.name === 'core/audio' || + block.name === 'core/video' ) && + ( block.attributes.url || block.attributes.src ) + ).length > 0; + const blockTypeIcon = useSelect( ( select ) => { const { getBlockType } = select( blocksStore ); @@ -63,7 +72,7 @@ const InserterDraggableBlocks = ( { ? [ createBlock( 'core/block', { ref: pattern.id } ) ] : blocks; event.dataTransfer.setData( - 'text/html', + blocksContainMedia ? 'default' : 'text/html', serialize( parsedBlocks ) ); } } diff --git a/packages/block-editor/src/components/media-placeholder/index.js b/packages/block-editor/src/components/media-placeholder/index.js index 07a3f8829e71d1..2f1a47be2f5a6e 100644 --- a/packages/block-editor/src/components/media-placeholder/index.js +++ b/packages/block-editor/src/components/media-placeholder/index.js @@ -288,8 +288,10 @@ export function MediaPlaceholder( { } } - async function onHTMLDrop( HTML ) { - const blocks = pasteHandler( { HTML } ); + async function onDrop( event ) { + const blocks = pasteHandler( { + HTML: event.dataTransfer?.getData( 'default' ), + } ); return await handleBlocksDrop( blocks ); } @@ -379,9 +381,7 @@ export function MediaPlaceholder( { return null; } - return ( - - ); + return ; }; const renderCancelLink = () => { diff --git a/test/e2e/specs/editor/blocks/image.spec.js b/test/e2e/specs/editor/blocks/image.spec.js index 6110a125ff6f7e..b2195f2c676885 100644 --- a/test/e2e/specs/editor/blocks/image.spec.js +++ b/test/e2e/specs/editor/blocks/image.spec.js @@ -545,7 +545,7 @@ test.describe( 'Image', () => { dummy.style.left = 0; dummy.draggable = 'true'; dummy.addEventListener( 'dragstart', ( event ) => { - event.dataTransfer.setData( 'text/html', _html ); + event.dataTransfer.setData( 'default', _html ); setTimeout( () => { dummy.remove(); }, 0 );