Kaynağa Gözat

Tests: Simplified generateResizeTest function, also removed a temporary copy of this function used for latest unit test.

Marek Lewandowski 6 yıl önce
ebeveyn
işleme
338a157a0b
1 değiştirilmiş dosya ile 41 ekleme ve 94 silme
  1. 41 94
      packages/ckeditor5-image/tests/imageresize.js

+ 41 - 94
packages/ckeditor5-image/tests/imageresize.js

@@ -423,16 +423,21 @@ describe( 'ImageResize', () => {
 		} ) );
 
 		it( 'makes no change when clicking the handle without drag', () => {
-			generateResizeTest2( {
-				isSideImage: true,
-				expectedWidth: 100,
-				pointerOffset: {
-					x: 0,
-					y: 0
-				},
-				resizerPosition: 'bottom-left',
-				modelRegExp: /<paragraph>foo<\/paragraph><image imageStyle="side" src=".+?"><\/image>/
-			} )();
+			const resizerPosition = 'bottom-left';
+			const expectedWidth = 100;
+			const domParts = getWidgetDomParts( widget, resizerPosition );
+			const initialPointerPosition = getResizerCoordinates( domParts.figure, resizerPosition );
+
+			focusEditor( editor );
+			fireMouseEvent( domParts.resizeHandle, 'mousedown', initialPointerPosition );
+
+			expect( getDomWidth( domParts.figure ), 'DOM width check' ).to.be.closeTo( expectedWidth, 2 );
+
+			fireMouseEvent( domParts.resizeHandle, 'mouseup', initialPointerPosition );
+
+			const modelItem = editor.model.document.getRoot().getChild( 1 );
+
+			expect( modelItem.getAttribute( 'width' ), 'model width attribute' ).to.be.undefined;
 		} );
 
 		function generateSideResizeTest( options ) {
@@ -719,109 +724,47 @@ describe( 'ImageResize', () => {
 		// options.expectedWidth
 		// [options.isSideImage=false]
 		// Returns a test case that puts
-		return function() {
+		return async function() {
+			const domParts = getWidgetDomParts( widget, options.resizerPosition );
 			const domResizeWrapper = view.domConverter.mapViewToDom( widget.getChild( 1 ) );
-			const domResizeHandle = domResizeWrapper.querySelector( `.ck-widget__resizer__handle-${ options.resizerPosition }` );
-			const domFigure = view.domConverter.mapViewToDom( widget );
-			const domImage = domFigure.querySelector( 'img' );
-			const imageRect = new Rect( domImage );
-			const resizerPositionParts = options.resizerPosition.split( '-' );
 
 			const modelRegExp = options.modelRegExp ? options.modelRegExp :
 				/<paragraph>foo<\/paragraph><image src=".+?" width="([\d]+)px"><\/image>/;
 
 			focusEditor( editor );
 
-			const initialPointerPosition = {
-				pageX: imageRect.left,
-				pageY: imageRect.top
-			};
+			const initialPointerPosition = getResizerCoordinates( domParts.figure, options.resizerPosition );
 
-			if ( resizerPositionParts.includes( 'right' ) ) {
-				initialPointerPosition.pageX = imageRect.right;
-			}
+			fireMouseEvent( domParts.resizeHandle, 'mousedown', initialPointerPosition );
+			fireMouseEvent( domParts.resizeHandle, 'mousemove', initialPointerPosition );
 
-			if ( resizerPositionParts.includes( 'bottom' ) ) {
-				initialPointerPosition.pageY = imageRect.bottom;
-			}
+			// We need to wait as mousemove events are throttled.
+			await wait( 40 );
 
 			const finishPointerPosition = Object.assign( {}, initialPointerPosition );
 
 			finishPointerPosition.pageX += options.pointerOffset.x || 0;
 			finishPointerPosition.pageY += options.pointerOffset.y || 0;
 
-			fireMouseEvent( domResizeHandle, 'mousedown', initialPointerPosition );
-			fireMouseEvent( domResizeHandle, 'mousemove', initialPointerPosition );
-
-			// We need to wait as mousemove events are throttled.
-			return wait( 40 )
-				.then( () => {
-					fireMouseEvent( domResizeHandle, 'mousemove', finishPointerPosition );
-
-					expect( parseInt( domFigure.style.width ) ).to.be.closeTo( options.expectedWidth, 2, 'DOM width check' );
-
-					if ( options.checkBeforeMouseUp ) {
-						options.checkBeforeMouseUp( domFigure, domResizeWrapper );
-					}
+			fireMouseEvent( domParts.resizeHandle, 'mousemove', finishPointerPosition );
 
-					fireMouseEvent( domResizeHandle, 'mouseup', finishPointerPosition );
+			expect( parseInt( domParts.figure.style.width ) ).to.be.closeTo( options.expectedWidth, 2, 'DOM width check' );
 
-					expect( getData( editor.model, {
-						withoutSelection: true
-					} ) ).to.match( modelRegExp );
-
-					const modelItem = options.getModel ? options.getModel() : editor.model.document.getRoot().getChild( 1 );
-					const modelWidth = modelItem.getAttribute( 'width' );
-
-					expect( parseFloat( modelWidth, 0 ) )
-						.to.be.closeTo( options.expectedWidth, 2, 'Model width check' );
-				} );
-		};
-	}
-
-	function generateResizeTest2( options ) {
-		// options.resizerPosition - top-left / top-right / bottom-right / bottom-left
-		// options.pointerOffset - object - pointer offset relative to the dragged corner. Negative values are perfectly fine.
-		// e.g. { x: 10, y: -5 }
-		// options.expectedWidth
-		// [options.isSideImage=false]
-		// Returns a test case that puts
-		return function() {
-			const domParts = getWidgetDomParts( widget, options );
-			const modelRegExp = options.modelRegExp ? options.modelRegExp :
-				/<paragraph>foo<\/paragraph><image src=".+?" width="([\d]+)px"><\/image>/;
-
-			focusEditor( editor );
-
-			const initialPointerPosition = getResizerCoordinates( domParts.figure, options.resizerPosition );
-
-			fireMouseEvent( domParts.resizeHandle, 'mousedown', initialPointerPosition );
-
-			// We need to wait as mousemove events are throttled.
-			return wait( 40 )
-				.then( () => {
-					const figureSize = new Rect( domParts.figure );
-					expect( figureSize.width ).to.be.closeTo( options.expectedWidth, 2, 'DOM width check' );
-
-					if ( options.checkBeforeMouseUp ) {
-						options.checkBeforeMouseUp( domParts.figure, domParts.resizeWrapper );
-					}
-
-					const finishPointerPosition = Object.assign( {}, initialPointerPosition );
-
-					finishPointerPosition.pageX += options.pointerOffset.x || 0;
-					finishPointerPosition.pageY += options.pointerOffset.y || 0;
+			if ( options.checkBeforeMouseUp ) {
+				options.checkBeforeMouseUp( domParts.figure, domResizeWrapper );
+			}
 
-					fireMouseEvent( domParts.resizeHandle, 'mouseup', finishPointerPosition );
+			fireMouseEvent( domParts.resizeHandle, 'mouseup', finishPointerPosition );
 
-					expect( getData( editor.model, {
-						withoutSelection: true
-					} ) ).to.match( modelRegExp );
+			expect( getData( editor.model, {
+				withoutSelection: true
+			} ) ).to.match( modelRegExp );
 
-					const modelItem = options.getModel ? options.getModel() : editor.model.document.getRoot().getChild( 1 );
+			const modelItem = options.getModel ? options.getModel() : editor.model.document.getRoot().getChild( 1 );
+			const modelWidth = modelItem.getAttribute( 'width' );
 
-					expect( modelItem.hasAttribute( 'width' ), 'model width attribute presence' ).to.be.false;
-				} );
+			expect( parseFloat( modelWidth, 0 ) )
+				.to.be.closeTo( options.expectedWidth, 2, 'Model width check' );
 		};
 	}
 
@@ -850,9 +793,9 @@ describe( 'ImageResize', () => {
 		return initialPointerPosition;
 	}
 
-	function getWidgetDomParts( widget, options ) {
+	function getWidgetDomParts( widget, resizerPosition ) {
 		const resizeWrapper = view.domConverter.mapViewToDom( widget.getChild( 1 ) );
-		const resizeHandle = resizeWrapper.querySelector( `.ck-widget__resizer__handle-${ options.resizerPosition }` );
+		const resizeHandle = resizeWrapper.querySelector( `.ck-widget__resizer__handle-${ resizerPosition }` );
 		const figure = view.domConverter.mapViewToDom( widget );
 
 		return {
@@ -862,6 +805,10 @@ describe( 'ImageResize', () => {
 		};
 	}
 
+	function getDomWidth( domElement ) {
+		return new Rect( domElement ).width;
+	}
+
 	function getSelectedImageResizer( editor ) {
 		return editor.plugins.get( 'WidgetResize' )._getResizerByViewElement(
 			editor.editing.view.document.selection.getSelectedElement()