From 3608e7bdd92bd558180acc082022b3dcc8f85c2e Mon Sep 17 00:00:00 2001 From: Mateusz Baginski Date: Fri, 9 Feb 2024 12:58:57 +0100 Subject: [PATCH 1/2] Fix resize image centering issue --- .../ckeditor5-image/src/imageresize/imageresizehandles.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/ckeditor5-image/src/imageresize/imageresizehandles.ts b/packages/ckeditor5-image/src/imageresize/imageresizehandles.ts index 3a5f8431442..f311ddaa700 100644 --- a/packages/ckeditor5-image/src/imageresize/imageresizehandles.ts +++ b/packages/ckeditor5-image/src/imageresize/imageresizehandles.ts @@ -104,11 +104,11 @@ export default class ImageResizeHandles extends Plugin { // Return the model image element parent to avoid setting an inline element (/) as a resize host. return domConverter.mapViewToDom( mapper.toViewElement( imageModel.parent as Element )! ) as HTMLElement; }, - // TODO consider other positions. + isCentered() { const imageStyle = imageModel.getAttribute( 'imageStyle' ); - return !imageStyle || imageStyle == 'block' || imageStyle == 'alignCenter'; + return imageStyle == 'alignCenter'; }, onCommit( newValue ) { From 5396cc05dcec5c4945b2ea2d441d90d00bc3ecc2 Mon Sep 17 00:00:00 2001 From: Mateusz Baginski Date: Fri, 9 Feb 2024 13:36:39 +0100 Subject: [PATCH 2/2] Fix image resize tests --- .../tests/imageresize/imageresizehandles.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/ckeditor5-image/tests/imageresize/imageresizehandles.js b/packages/ckeditor5-image/tests/imageresize/imageresizehandles.js index 512587d2853..8b05af6ec96 100644 --- a/packages/ckeditor5-image/tests/imageresize/imageresizehandles.js +++ b/packages/ckeditor5-image/tests/imageresize/imageresizehandles.js @@ -87,7 +87,7 @@ describe( 'ImageResizeHandles', () => { resizerMouseSimulator.dragTo( editor, domParts.resizeHandle, finalPointerPosition ); expect( spy.calledOnce ).to.be.true; - expect( spy.args[ 0 ][ 0 ] ).to.deep.equal( { width: '80px' } ); + expect( spy.args[ 0 ][ 0 ] ).to.deep.equal( { width: '90px' } ); } ); it( 'disables the resizer if the command is disabled', async () => { @@ -146,7 +146,7 @@ describe( 'ImageResizeHandles', () => { resizerMouseSimulator.dragTo( editor, domParts.resizeHandle, finalPointerPosition ); expect( stub.calledOnce ).to.be.true; - expect( stub.args[ 0 ][ 0 ] ).to.deep.equal( { width: '80px' } ); + expect( stub.args[ 0 ][ 0 ] ).to.deep.equal( { width: '90px' } ); expect( widget.hasClass( 'image_resized' ), 'CSS class' ).to.be.false; expect( widget.hasStyle( 'width' ), 'width style' ).to.be.false; @@ -564,7 +564,7 @@ describe( 'ImageResizeHandles', () => { resizerMouseSimulator.dragTo( editor, domParts.resizeHandle, finalPointerPosition ); expect( spy.calledOnce ).to.be.true; - expect( spy.args[ 0 ][ 0 ] ).to.deep.equal( { width: '80px' } ); + expect( spy.args[ 0 ][ 0 ] ).to.deep.equal( { width: '90px' } ); } ); it( 'disables the resizer if the command is disabled', async () => { @@ -807,7 +807,7 @@ describe( 'ImageResizeHandles', () => { resizerMouseSimulator.dragTo( editor, domParts.resizeHandle, finalPointerPosition ); - sinon.assert.calledWithExactly( spy.firstCall, { width: '80px' } ); + sinon.assert.calledWithExactly( spy.firstCall, { width: '90px' } ); await editor.destroy(); } );