8
0
فهرست منبع

Fixed support for inserting multiple files when pasting.

Piotrek Koszuliński 8 سال پیش
والد
کامیت
eae0866fc2
2فایلهای تغییر یافته به همراه31 افزوده شده و 3 حذف شده
  1. 7 3
      packages/ckeditor5-upload/src/imageuploadengine.js
  2. 24 0
      packages/ckeditor5-upload/tests/imageuploadengine.js

+ 7 - 3
packages/ckeditor5-upload/src/imageuploadengine.js

@@ -46,17 +46,21 @@ export default class ImageUploadEngine extends Plugin {
 
 		// Execute imageUpload command when image is dropped or pasted.
 		editor.editing.view.on( 'clipboardInput', ( evt, data ) => {
-			const targetModelSelection = new ModelSelection(
+			let targetModelSelection = new ModelSelection(
 				data.targetRanges.map( viewRange => editor.editing.mapper.toModelRange( viewRange ) )
 			);
 
-			const insertAt = findOptimalInsertionPosition( targetModelSelection );
-
 			for ( const file of data.dataTransfer.files ) {
+				const insertAt = findOptimalInsertionPosition( targetModelSelection );
+
 				if ( isImageType( file ) ) {
 					editor.execute( 'imageUpload', { file, insertAt } );
 					evt.stop();
 				}
+
+				// Use target ranges only for the first image. Then, use that image position
+				// so we keep adding the next ones after the previous one.
+				targetModelSelection = doc.selection;
 			}
 		} );
 

+ 24 - 0
packages/ckeditor5-upload/tests/imageuploadengine.js

@@ -104,6 +104,30 @@ describe( 'ImageUploadEngine', () => {
 		);
 	} );
 
+	it( 'should execute imageUpload command when multiple files image are pasted', () => {
+		const spy = sinon.spy( editor, 'execute' );
+		const files = [ createNativeFileMock(), createNativeFileMock() ];
+		const dataTransfer = new DataTransfer( { files } );
+		setModelData( doc, '<paragraph>[]foo</paragraph>' );
+
+		const targetRange = Range.createFromParentsAndOffsets( doc.getRoot(), 1, doc.getRoot(), 1 );
+		const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
+
+		viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
+
+		sinon.assert.calledTwice( spy );
+		sinon.assert.calledWith( spy, 'imageUpload' );
+
+		const id1 = fileRepository.getLoader( files[ 0 ] ).id;
+		const id2 = fileRepository.getLoader( files[ 1 ] ).id;
+
+		expect( getModelData( doc ) ).to.equal(
+			'<paragraph>foo</paragraph>' +
+			`<image uploadId="${ id1 }" uploadStatus="reading"></image>` +
+			`[<image uploadId="${ id2 }" uploadStatus="reading"></image>]`
+		);
+	} );
+
 	it( 'should not execute imageUpload command when file is not an image', () => {
 		const spy = sinon.spy( editor, 'execute' );
 		const viewDocument = editor.editing.view;