Merge pull request #326 from ckeditor/t/ckeditor5-core/193

Other: Make the `Clipboard` plugin a required dependency of `ImageUploadEditing`. Closes ckeditor/ckeditor5-core#193.

Author: Reinmar

src/imageupload/imageuploadediting.js

@@ -10,6 +10,7 @@
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import FileRepository from '@ckeditor/ckeditor5-upload/src/filerepository';
 import Notification from '@ckeditor/ckeditor5-ui/src/notification/notification';
+import Clipboard from '@ckeditor/ckeditor5-clipboard/src/clipboard';
 import UpcastWriter from '@ckeditor/ckeditor5-engine/src/view/upcastwriter';
 import env from '@ckeditor/ckeditor5-utils/src/env';
 
@@ -27,7 +28,7 @@ export default class ImageUploadEditing extends Plugin {
 	 * @inheritDoc
 	 */
 	static get requires() {
-		return [ FileRepository, Notification ];
+		return [ FileRepository, Notification, Clipboard ];
 	}
 
 	static get pluginName() {
@@ -118,31 +119,29 @@ export default class ImageUploadEditing extends Plugin {
 		// For every image file, a new file loader is created and a placeholder image is
 		// inserted into the content. Then, those images are uploaded once they appear in the model
 		// (see Document#change listener below).
-		if ( editor.plugins.has( 'Clipboard' ) ) {
-			this.listenTo( editor.plugins.get( 'Clipboard' ), 'inputTransformation', ( evt, data ) => {
-				const fetchableImages = Array.from( editor.editing.view.createRangeIn( data.content ) )
-					.filter( value => isLocalImage( value.item ) && !value.item.getAttribute( 'uploadProcessed' ) )
-					.map( value => { return { promise: fetchLocalImage( value.item ), imageElement: value.item }; } );
-
-				if ( !fetchableImages.length ) {
-					return;
-				}
+		this.listenTo( editor.plugins.get( Clipboard ), 'inputTransformation', ( evt, data ) => {
+			const fetchableImages = Array.from( editor.editing.view.createRangeIn( data.content ) )
+				.filter( value => isLocalImage( value.item ) && !value.item.getAttribute( 'uploadProcessed' ) )
+				.map( value => { return { promise: fetchLocalImage( value.item ), imageElement: value.item }; } );
 
-				const writer = new UpcastWriter();
+			if ( !fetchableImages.length ) {
+				return;
+			}
 
-				for ( const fetchableImage of fetchableImages ) {
-					// Set attribute marking that the image was processed already.
-					writer.setAttribute( 'uploadProcessed', true, fetchableImage.imageElement );
+			const writer = new UpcastWriter();
 
-					const loader = fileRepository.createLoader( fetchableImage.promise );
+			for ( const fetchableImage of fetchableImages ) {
+				// Set attribute marking that the image was processed already.
+				writer.setAttribute( 'uploadProcessed', true, fetchableImage.imageElement );
 
-					if ( loader ) {
-						writer.setAttribute( 'src', '', fetchableImage.imageElement );
-						writer.setAttribute( 'uploadId', loader.id, fetchableImage.imageElement );
-					}
+				const loader = fileRepository.createLoader( fetchableImage.promise );
+
+				if ( loader ) {
+					writer.setAttribute( 'src', '', fetchableImage.imageElement );
+					writer.setAttribute( 'uploadId', loader.id, fetchableImage.imageElement );
 				}
-			} );
-		}
+			}
+		} );
 
 		// Prevents from the browser redirecting to the dropped image.
 		editor.editing.view.document.on( 'dragover', ( evt, data ) => {

tests/imageupload/imageuploadediting.js

@@ -95,10 +95,13 @@ describe( 'ImageUploadEditing', () => {
 		expect( editor.commands.get( 'imageUpload' ) ).to.be.instanceOf( ImageUploadCommand );
 	} );
 
-	it( 'should not crash when Clipboard plugin is not available', () => {
+	it( 'should load Clipboard plugin', () => {
 		return VirtualTestEditor
 			.create( {
 				plugins: [ ImageEditing, ImageUploadEditing, Paragraph, UndoEditing, UploadAdapterPluginMock ]
+			} )
+			.then( editor => {
+				expect( editor.plugins.get( Clipboard ) ).to.be.instanceOf( Clipboard );
 			} );
 	} );