Переглянути джерело

Tests form ImageCaptioningEngine.

Szymon Kupś 9 роки тому
батько
коміт
c5830c314c

+ 0 - 1
packages/ckeditor5-image/src/imagecaptioning/imagecaptioningengine.js

@@ -178,7 +178,6 @@ function insertCaptionElement( evt, changeType, data, batch ) {
 		const item = value.item;
 
 		if ( value.type == 'elementStart' && isImage( item ) && !getCaptionFromImage( item ) ) {
-			// Using batch of insertion.
 			batch.document.enqueueChanges( () => {
 				batch.insert( ModelPosition.createAt( item, 'end' ), new ModelElement( 'caption' ) );
 			} );

+ 137 - 0
packages/ckeditor5-image/tests/imagecaptioning/imagecaptioningengine.js

@@ -4,9 +4,12 @@
  */
 
 import VirtualTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/virtualtesteditor';
+import ModelElement from '@ckeditor/ckeditor5-engine/src/model/element';
+import ModelPosition from '@ckeditor/ckeditor5-engine/src/model/position';
 import ImageCaptioningEngine from '../../src/imagecaptioning/imagecaptioningengine';
 import ImageEngine from '../../src/imageengine';
 import { getData as getModelData, setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import { getData as getViewData } from '@ckeditor/ckeditor5-engine/src/dev-utils/view';
 import buildViewConverter from '@ckeditor/ckeditor5-engine/src/conversion/buildviewconverter';
 import buildModelConverter from '@ckeditor/ckeditor5-engine/src/conversion/buildmodelconverter';
 
@@ -83,4 +86,138 @@ describe( 'ImageCaptioningEngine', () => {
 			} );
 		} );
 	} );
+
+	describe( 'editing pipeline', () => {
+		describe( 'model to view', () => {
+			it( 'should convert caption element to figcaption contenteditable', () => {
+				setModelData( document, '<image src="img.png"><caption>Foo bar baz.</caption></image>' );
+
+				expect( getViewData( viewDocument, { withoutSelection: true } ) ).to.equal(
+					'<figure class="image ck-widget" contenteditable="false">' +
+						'<img src="img.png"></img>' +
+						'<figcaption contenteditable="true">Foo bar baz.</figcaption>' +
+					'</figure>'
+				);
+			} );
+
+			it( 'should not convert caption if it\'s empty', () => {
+				setModelData( document, '<image src="img.png"><caption></caption></image>' );
+
+				expect( getViewData( viewDocument, { withoutSelection: true } ) ).to.equal(
+					'<figure class="image ck-widget" contenteditable="false"><img src="img.png"></img></figure>'
+				);
+			} );
+
+			it( 'should not convert caption from other elements', () => {
+				setModelData( document, '<widget>foo bar<caption></caption></widget>' );
+				expect( getViewData( viewDocument, { withoutSelection: true } ) ).to.equal( '<widget>foo bar</widget>' );
+			} );
+		} );
+	} );
+
+	describe( 'inserting image to document', () => {
+		it( 'should add caption element if image does not have it', () => {
+			const image = new ModelElement( 'image', { src: '', alt: '' } );
+			const batch = document.batch();
+
+			document.enqueueChanges( () => {
+				batch.insert( new ModelPosition( document.getRoot(), [ 0 ] ), image );
+			} );
+
+			expect( getModelData( document, { withoutSelection: true } ) ).to.equal(
+				'<image alt="" src=""><caption></caption></image>'
+			);
+		} );
+
+		it( 'should not add caption element if image does not have it', () => {
+			const caption = new ModelElement( 'caption', null, 'foo bar' );
+			const image = new ModelElement( 'image', { src: '', alt: '' }, caption );
+			const batch = document.batch();
+
+			document.enqueueChanges( () => {
+				batch.insert( new ModelPosition( document.getRoot(), [ 0 ] ), image );
+			} );
+
+			expect( getModelData( document, { withoutSelection: true } ) ).to.equal(
+				'<image alt="" src=""><caption>foo bar</caption></image>'
+			);
+		} );
+
+		it( 'should do nothing for other changes than insert', () => {
+			setModelData( document, '<image src=""><caption>foo bar</caption></image>' );
+			const image = document.getRoot().getChild( 0 );
+			const batch = document.batch();
+
+			document.enqueueChanges( () => {
+				batch.setAttribute( image, 'alt', 'alt text' );
+			} );
+
+			expect( getModelData( document, { withoutSelection: true } ) ).to.equal(
+				'<image alt="alt text" src=""><caption>foo bar</caption></image>'
+			);
+		} );
+	} );
+
+	describe( 'editing view', () => {
+		it( 'image should have empty figcaption element when is selected', () => {
+			setModelData( document, '[<image src=""><caption></caption></image>]' );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+					'<img src=""></img>' +
+					'<figcaption contenteditable="true"></figcaption>' +
+				'</figure>]'
+			);
+		} );
+
+		it( 'image should not have empty figcaption element when is not selected', () => {
+			setModelData( document, '[]<image src=""><caption></caption></image>' );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[]<figure class="image ck-widget" contenteditable="false">' +
+					'<img src=""></img>' +
+				'</figure>'
+			);
+		} );
+
+		it( 'should not add additional figcaption if one is already present', () => {
+			setModelData( document, '[<image src=""><caption>foo bar</caption></image>]' );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+					'<img src=""></img>' +
+					'<figcaption contenteditable="true">foo bar</figcaption>' +
+				'</figure>]'
+			);
+		} );
+
+		it( 'should remove figcaption when caption is empty and image is no longer selected', () => {
+			setModelData( document, '[<image src=""><caption></caption></image>]' );
+
+			document.enqueueChanges( () => {
+				document.selection.removeAllRanges();
+			} );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'[]<figure class="image ck-widget" contenteditable="false">' +
+					'<img src=""></img>' +
+				'</figure>'
+			);
+		} );
+
+		it( 'should not remove figcatpion when selection is inside it even when it is empty', () => {
+			setModelData( document, '<image src=""><caption>[foo bar]</caption></image>' );
+
+			document.enqueueChanges( () => {
+				document.batch().remove( document.selection.getFirstRange() );
+			} );
+
+			expect( getViewData( viewDocument ) ).to.equal(
+				'<figure class="image ck-widget ck-widget_selected" contenteditable="false">' +
+					'<img src=""></img>' +
+					'<figcaption contenteditable="true">[]</figcaption>' +
+				'</figure>'
+			);
+		} );
+	} );
 } );