Merge pull request #90 from ckeditor/t/89

Other: Aligned the use of the `Widget` plugin by the `Image`. Closes #89.
ckeditor · Apr 3, 2017 · 16f285d · 16f285d
2 parents 016b68e + cfa3a4d
commit 16f285d
Show file tree

Hide file tree

Showing 4 changed files with 68 additions and 72 deletions.
diff --git a/src/image/imageengine.js b/src/image/imageengine.js
@@ -9,7 +9,6 @@
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import buildModelConverter from '@ckeditor/ckeditor5-engine/src/conversion/buildmodelconverter';
-import WidgetEngine from '@ckeditor/ckeditor5-widget/src/widgetengine';
 import { viewToModelImage, createImageAttributeConverter } from './converters';
 import { toImageWidget } from './utils';
 import ViewContainerElement from '@ckeditor/ckeditor5-engine/src/view/containerelement';
@@ -23,13 +22,6 @@ import ViewEmptyElement from '@ckeditor/ckeditor5-engine/src/view/emptyelement';
  * @extends module:core/plugin~Plugin
  */
 export default class ImageEngine extends Plugin {
-	/**
-	 * @inheritDoc
-	 */
-	static get requires() {
-		return [ WidgetEngine ];
-	}
-
 	/**
 	 * @inheritDoc
 	 */

diff --git a/tests/image.js b/tests/image.js
@@ -10,9 +10,12 @@ import Image from '../src/image';
 import ImageEngine from '../src/image/imageengine';
 import Widget from '@ckeditor/ckeditor5-widget/src/widget';
 import ImageTextAlternative from '../src/imagetextalternative';
+import { setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import { getData as getViewData } from '@ckeditor/ckeditor5-engine/src/dev-utils/view';
+import ModelRange from '@ckeditor/ckeditor5-engine/src/model/range';
 
 describe( 'Image', () => {
-	let editor;
+	let editor, document, viewDocument;
 
 	beforeEach( () => {
 		const editorElement = window.document.createElement( 'div' );
@@ -23,6 +26,8 @@ describe( 'Image', () => {
 		} )
 		.then( newEditor => {
 			editor = newEditor;
+			document = editor.document;
+			viewDocument = editor.editing.view;
 		} );
 	} );
 
@@ -41,4 +46,62 @@ describe( 'Image', () => {
 	it( 'should load ImageTextAlternative plugin', () => {
 		expect( editor.plugins.get( ImageTextAlternative ) ).to.instanceOf( ImageTextAlternative );
 	} );
+
+	describe( 'selection', () => {
+		it( 'should create fake selection', () => {
+			setModelData( document, '[<image alt="alt text" src="foo.png"></image>]' );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+					'<img alt="alt text" src="foo.png"></img>' +
+				'</figure>]'
+			);
+
+			expect( viewDocument.selection.isFake ).to.be.true;
+			expect( viewDocument.selection.fakeSelectionLabel ).to.equal( 'alt text image widget' );
+		} );
+
+		it( 'should create proper fake selection label when alt attribute is empty', () => {
+			setModelData( document, '[<image src="foo.png" alt=""></image>]' );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'<img alt="" src="foo.png"></img>' +
+				'</figure>]'
+			);
+
+			expect( viewDocument.selection.isFake ).to.be.true;
+			expect( viewDocument.selection.fakeSelectionLabel ).to.equal( 'image widget' );
+		} );
+
+		it( 'should remove selected class from previously selected element', () => {
+			setModelData( document,
+				'[<image src="foo.png" alt="alt text"></image>]' +
+				'<image src="foo.png" alt="alt text"></image>'
+			);
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'<img alt="alt text" src="foo.png"></img>' +
+				'</figure>]' +
+				'<figure class="image ck-widget" contenteditable="false">' +
+				'<img alt="alt text" src="foo.png"></img>' +
+				'</figure>'
+			);
+
+			document.enqueueChanges( () => {
+				const secondImage = document.getRoot().getChild( 1 );
+				document.selection.setRanges( [ ModelRange.createOn( secondImage ) ] );
+			} );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'<figure class="image ck-widget" contenteditable="false">' +
+				'<img alt="alt text" src="foo.png"></img>' +
+				'</figure>' +
+				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'<img alt="alt text" src="foo.png"></img>' +
+				'</figure>]'
+			);
+		} );
+	} );
 } );
diff --git a/tests/image/imageengine.js b/tests/image/imageengine.js
@@ -10,7 +10,6 @@ import { getData as getViewData } from '@ckeditor/ckeditor5-engine/src/dev-utils
 import buildViewConverter from '@ckeditor/ckeditor5-engine/src/conversion/buildviewconverter';
 import buildModelConverter from '@ckeditor/ckeditor5-engine/src/conversion/buildmodelconverter';
 import { isImageWidget } from '../../src/image/utils';
-import ModelRange from '@ckeditor/ckeditor5-engine/src/model/range';
 
 describe( 'ImageEngine', () => {
 	let editor, document, viewDocument;
@@ -208,62 +207,4 @@ describe( 'ImageEngine', () => {
 			} );
 		} );
 	} );
-
-	describe( 'selection conversion', () => {
-		it( 'should convert selection', () => {
-			setModelData( document, '[<image alt="alt text" src="foo.png"></image>]' );
-
-			expect( getViewData( viewDocument ) ).to.equal(
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
-					'<img alt="alt text" src="foo.png"></img>' +
-				'</figure>]'
-			);
-
-			expect( viewDocument.selection.isFake ).to.be.true;
-			expect( viewDocument.selection.fakeSelectionLabel ).to.equal( 'alt text image widget' );
-		} );
-
-		it( 'should create proper fake selection label when alt attribute is empty', () => {
-			setModelData( document, '[<image src="foo.png" alt=""></image>]' );
-
-			expect( getViewData( viewDocument ) ).to.equal(
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
-					'<img alt="" src="foo.png"></img>' +
-				'</figure>]'
-			);
-
-			expect( viewDocument.selection.isFake ).to.be.true;
-			expect( viewDocument.selection.fakeSelectionLabel ).to.equal( 'image widget' );
-		} );
-
-		it( 'should remove selected class from previously selected element', () => {
-			setModelData( document,
-				'[<image src="foo.png" alt="alt text"></image>]' +
-				'<image src="foo.png" alt="alt text"></image>'
-			);
-
-			expect( getViewData( viewDocument ) ).to.equal(
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
-					'<img alt="alt text" src="foo.png"></img>' +
-				'</figure>]' +
-				'<figure class="image ck-widget" contenteditable="false">' +
-					'<img alt="alt text" src="foo.png"></img>' +
-				'</figure>'
-			);
-
-			document.enqueueChanges( () => {
-				const secondImage = document.getRoot().getChild( 1 );
-				document.selection.setRanges( [ ModelRange.createOn( secondImage ) ] );
-			} );
-
-			expect( getViewData( viewDocument ) ).to.equal(
-				'<figure class="image ck-widget" contenteditable="false">' +
-					'<img alt="alt text" src="foo.png"></img>' +
-				'</figure>' +
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
-					'<img alt="alt text" src="foo.png"></img>' +
-				'</figure>]'
-			);
-		} );
-	} );
 } );
diff --git a/tests/imagecaption/imagecaptionengine.js b/tests/imagecaption/imagecaptionengine.js
@@ -298,7 +298,7 @@ describe( 'ImageCaptionEngine', () => {
 			setModelData( document, '[<image src=""><caption></caption></image>]' );
 
 			expect( getViewData( viewDocument ) ).to.equal(
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'[<figure class="image ck-widget" contenteditable="false">' +
 					'<img src=""></img>' +
 					'<figcaption class="ck-placeholder ck-editable" contenteditable="true" data-placeholder="Enter image caption">' +
 					'</figcaption>' +
@@ -322,7 +322,7 @@ describe( 'ImageCaptionEngine', () => {
 			setModelData( document, '[<image src=""><caption>foo bar</caption></image>]' );
 
 			expect( getViewData( viewDocument ) ).to.equal(
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'[<figure class="image ck-widget" contenteditable="false">' +
 					'<img src=""></img>' +
 					'<figcaption class="ck-editable" contenteditable="true" data-placeholder="Enter image caption">foo bar</figcaption>' +
 				'</figure>]'
@@ -372,7 +372,7 @@ describe( 'ImageCaptionEngine', () => {
 			} );
 
 			expect( getViewData( viewDocument ) ).to.equal(
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'[<figure class="image ck-widget" contenteditable="false">' +
 					'<img src=""></img>' +
 					'<figcaption class="ck-editable ck-placeholder" contenteditable="true" data-placeholder="Enter image caption"></figcaption>' +
 				'</figure>]'
@@ -392,7 +392,7 @@ describe( 'ImageCaptionEngine', () => {
 					'<img src=""></img>' +
 					'<figcaption class="ck-editable" contenteditable="true" data-placeholder="Enter image caption">foo bar</figcaption>' +
 				'</figure>' +
-				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+				'[<figure class="image ck-widget" contenteditable="false">' +
 					'<img src=""></img>' +
 					'<figcaption class="ck-placeholder ck-editable" contenteditable="true" data-placeholder="Enter image caption"></figcaption>' +
 				'</figure>]'