Procházet zdrojové kódy

Tests: Added integration test for resize in percents.

Marek Lewandowski před 5 roky
rodič
revize
f610e84e88
1 změnil soubory, kde provedl 72 přidání a 9 odebrání
  1. 72 9
      packages/ckeditor5-widget/tests/widgetresize.js

+ 72 - 9
packages/ckeditor5-widget/tests/widgetresize.js

@@ -55,12 +55,6 @@ describe( 'WidgetResize', () => {
 		};
 	} );
 
-	beforeEach( () => {
-		for ( const stub of Object.values( mouseListenerStubs ) ) {
-			stub.resetHistory();
-		}
-	} );
-
 	after( () => {
 		for ( const stub of Object.values( mouseListenerStubs ) ) {
 			stub.restore();
@@ -76,6 +70,16 @@ describe( 'WidgetResize', () => {
 
 		widget = view.document.getRoot().getChild( 0 );
 		widgetModel = editor.model.document.getRoot().getChild( 0 );
+
+		for ( const stub of Object.values( mouseListenerStubs ) ) {
+			stub.resetHistory();
+		}
+
+		// It's crucial to have a precisely defined editor size for this test suite.
+		editor.editing.view.change( writer => {
+			const viewEditableRoot = editor.editing.view.document.getRoot();
+			writer.setAttribute( 'style', 'width: 400px; padding: 0px; overflow: hidden', viewEditableRoot );
+		} );
 	} );
 
 	afterEach( () => {
@@ -285,6 +289,68 @@ describe( 'WidgetResize', () => {
 		} );
 	} );
 
+	describe( 'Integration (percents)', () => {
+		let resizer, resizerOptions;
+
+		beforeEach( async () => {
+			resizerOptions = {
+				modelElement: widgetModel,
+				viewElement: widget,
+				editor,
+
+				getHandleHost( domWidgetElement ) {
+					return domWidgetElement;
+				},
+
+				getResizeHost( domWidgetElement ) {
+					return domWidgetElement;
+				},
+
+				isCentered: () => false,
+
+				onCommit: sinon.stub()
+			};
+
+			resizer = editor.plugins.get( WidgetResize )
+				.attachTo( resizerOptions );
+		} );
+
+		it( 'properly sets the state for subsequent resizes', async function() {
+			this.timeout( 45000 );
+			focusEditor( editor );
+
+			resizer.redraw(); // @todo this shouldn't be necessary.
+
+			const usedResizer = 'top-right';
+			const domParts = getWidgetDomParts( widget, usedResizer, editor.editing.view );
+			const initialPointerPosition = getElementCenterPoint( domParts.widget, usedResizer );
+			const finalPointerPosition = Object.assign( {}, initialPointerPosition );
+
+			finalPointerPosition.pageX += 100;
+
+			mouseMock.down( editor, domParts.resizeHandle );
+
+			await wait( 40 );
+
+			mouseMock.move( editor, domParts.resizeHandle, finalPointerPosition );
+			mouseMock.up();
+
+			await wait( 40 );
+
+			mouseMock.down( editor, domParts.resizeHandle );
+
+			await wait( 40 );
+
+			finalPointerPosition.pageX += 100;
+			mouseMock.move( editor, domParts.resizeHandle, finalPointerPosition );
+			mouseMock.up();
+
+			expect( resizerOptions.onCommit.callCount ).to.be.equal( 2 );
+			sinon.assert.calledWithExactly( resizerOptions.onCommit.firstCall, '50%' );
+			sinon.assert.calledWithExactly( resizerOptions.onCommit.secondCall, '75%' );
+		} );
+	} );
+
 	function createEditor( element, config ) {
 		return ClassicEditor
 			.create( element, Object.assign( {
@@ -306,9 +372,6 @@ describe( 'WidgetResize', () => {
 						const div = viewWriter.createContainerElement( 'div' );
 						viewWriter.setStyle( 'height', '100px', div );
 						viewWriter.setStyle( 'width', '100px', div );
-						viewWriter.setStyle( 'position', 'absolute', div );
-						viewWriter.setStyle( 'top', '10px', div );
-						viewWriter.setStyle( 'bottom', '10px', div );
 
 						return toWidget( div, viewWriter, {
 							label: 'element label'