Skip to content
This repository has been archived by the owner on Jun 26, 2020. It is now read-only.

Commit

Permalink
Merge branch 'master' into t/ckeditor5-image/310
Browse files Browse the repository at this point in the history
  • Loading branch information
@mlewand
mlewand committed Oct 10, 2019
2 parents 3b15b00 + 707b8f0 commit 82871a7
Show file tree
Hide file tree
Showing 2 changed files with 128 additions and 24 deletions.
139 changes: 116 additions & 23 deletions tests/imageresize.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,33 +44,19 @@ describe( 'ImageResize', () => {
absoluteContainer.remove();
} );

beforeEach( () => {
editorElement = document.createElement( 'div' );

absoluteContainer.appendChild( editorElement );

return ClassicEditor
.create( editorElement, {
plugins: [ Image, ImageStyle, Paragraph, Undo, Table, ImageResize ],
image: {
resizeUnit: 'px'
}
} )
.then( newEditor => {
editor = newEditor;
view = editor.editing.view;
viewDocument = view.document;
widget = viewDocument.getRoot().getChild( 1 );
} );
} );

afterEach( () => {
editorElement.remove();
if ( editorElement ) {
editorElement.remove();
}

return editor.destroy();
if ( editor ) {
return editor.destroy();
}
} );

describe( 'conversion', () => {
beforeEach( () => createEditor() );

it( 'upcasts 100px width correctly', () => {
editor.setData( `<figure class="image" style="width:100px;"><img src="${ IMAGE_SRC_FIXTURE }"></figure>` );

Expand Down Expand Up @@ -99,6 +85,8 @@ describe( 'ImageResize', () => {
} );

describe( 'schema', () => {
beforeEach( () => createEditor() );

it( 'allows the width attribute', () => {
expect( editor.model.schema.checkAttribute( 'image', 'width' ) ).to.be.true;
} );
Expand All @@ -109,6 +97,8 @@ describe( 'ImageResize', () => {
} );

describe( 'command', () => {
beforeEach( () => createEditor() );

it( 'defines the imageResize command', () => {
expect( editor.commands.get( 'imageResize' ) ).to.be.instanceOf( ImageResizeCommand );
} );
Expand Down Expand Up @@ -180,6 +170,8 @@ describe( 'ImageResize', () => {
} );

describe( 'visual resizers', () => {
beforeEach( () => createEditor() );

beforeEach( () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image src="${ IMAGE_SRC_FIXTURE }"></image>]` );

Expand All @@ -202,7 +194,6 @@ describe( 'ImageResize', () => {
} );

it( 'is shown when image is focused', () => {
const widget = viewDocument.getRoot().getChild( 1 );
const allResizers = editor.ui.getEditableElement().querySelectorAll( '.ck-widget__resizer__handle' );
const domEventDataMock = {
target: widget,
Expand All @@ -221,6 +212,8 @@ describe( 'ImageResize', () => {
} );

describe( 'standard image resizing', () => {
beforeEach( () => createEditor() );

beforeEach( () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image src="${ IMAGE_SRC_FIXTURE }"></image>]` );

Expand Down Expand Up @@ -321,6 +314,8 @@ describe( 'ImageResize', () => {
} );

describe( 'side image resizing', () => {
beforeEach( () => createEditor() );

beforeEach( () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image imageStyle="side" src="${ IMAGE_SRC_FIXTURE }"></image>]` );

Expand Down Expand Up @@ -435,7 +430,79 @@ describe( 'ImageResize', () => {
}
} );

describe( 'percent resizing', () => {
beforeEach( () => createEditor( {
plugins: [ Image, ImageStyle, Paragraph, Undo, Table, ImageResize ]
} ) );

describe( 'standard image', () => {
beforeEach( () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image src="${ IMAGE_SRC_FIXTURE }"></image>]` );

widget = viewDocument.getRoot().getChild( 1 );
} );

it( 'shrinks correctly with left-bottom handler', generateResizeTest( {
expectedWidth: 16,
modelRegExp: /<paragraph>foo<\/paragraph><image src=".+?" width="([\d]{2}(?:\.[\d]{1,2}))%"><\/image>/,
pointerOffset: {
x: 10,
y: -10
},
resizerPosition: 'bottom-left'
} ) );

it( 'enlarges correctly with right-bottom handler', generateResizeTest( {
expectedWidth: 22,
modelRegExp: /<paragraph>foo<\/paragraph><image src=".+?" width="([\d]{2}(?:\.[\d]{1,2}))%"><\/image>/,
pointerOffset: {
x: 0,
y: 5
},
resizerPosition: 'bottom-right'
} ) );

it( 'enlarges correctly an image with unsupported width unit', async () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image src="${ IMAGE_SRC_FIXTURE }" width="50pt"></image>]` );

widget = viewDocument.getRoot().getChild( 1 );

await generateResizeTest( {
expectedWidth: 15,
modelRegExp: /<paragraph>foo<\/paragraph><image src=".+?" width="([\d]{2}(?:\.[\d]{1,2}))%"><\/image>/,
pointerOffset: {
x: 0,
y: 5
},
resizerPosition: 'bottom-right'
} )();
} );
} );

describe( 'side image', () => {
beforeEach( () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image imageStyle="side" src="${ IMAGE_SRC_FIXTURE }"></image>]` );

view = editor.editing.view;
viewDocument = view.document;
widget = viewDocument.getRoot().getChild( 1 );
} );

it( 'shrinks correctly with left-bottom handler', generateResizeTest( {
expectedWidth: 18,
modelRegExp: /<paragraph>foo<\/paragraph><image imageStyle="side" src=".+?" width="([\d]{2}(?:\.[\d]{1,2}))%"><\/image>/,
pointerOffset: {
x: 10,
y: -10
},
resizerPosition: 'bottom-left'
} ) );
} );
} );

describe( 'undo integration', () => {
beforeEach( () => createEditor() );

beforeEach( () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image src="${ IMAGE_SRC_FIXTURE }"></image>]` );

Expand Down Expand Up @@ -465,6 +532,8 @@ describe( 'ImageResize', () => {
} );

describe( 'table integration', () => {
beforeEach( () => createEditor() );

beforeEach( () => {
setData( editor.model,
'<table>' +
Expand All @@ -488,6 +557,8 @@ describe( 'ImageResize', () => {
} );

describe( 'srcset integration', () => {
beforeEach( () => createEditor() );

// The image is 96x96 pixels.
const imageBaseUrl = '/assets/sample.png';
const getModel = () => editor.model.document.getRoot().getChild( 0 );
Expand Down Expand Up @@ -561,6 +632,8 @@ describe( 'ImageResize', () => {

// TODO move to Resizer tests.
describe( 'Resizer', () => {
beforeEach( () => createEditor() );

it( 'uses rounded (int) values', async () => {
setData( editor.model, `<paragraph>foo</paragraph>[<image src="${ IMAGE_SRC_FIXTURE }"></image>]` );

Expand Down Expand Up @@ -692,4 +765,24 @@ describe( 'ImageResize', () => {
function getFirstResizer( editor ) {
return Array.from( editor.plugins.get( 'WidgetResize' ).resizers.values() )[ 0 ];
}

function createEditor( config ) {
editorElement = document.createElement( 'div' );

absoluteContainer.appendChild( editorElement );

return ClassicEditor
.create( editorElement, config || {
plugins: [ Image, ImageStyle, Paragraph, Undo, Table, ImageResize ],
image: {
resizeUnit: 'px'
}
} )
.then( newEditor => {
editor = newEditor;
view = editor.editing.view;
viewDocument = view.document;
widget = viewDocument.getRoot().getChild( 1 );
} );
}
} );
13 changes: 12 additions & 1 deletion tests/imageupload/imageuploadediting.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ import { getData as getViewData, stringify as stringifyView } from '@ckeditor/ck

import env from '@ckeditor/ckeditor5-utils/src/env';
import Notification from '@ckeditor/ckeditor5-ui/src/notification/notification';
import { assertCKEditorError } from '@ckeditor/ckeditor5-utils/tests/_utils/utils';

describe( 'ImageUploadEditing', () => {
// eslint-disable-next-line max-len
Expand Down Expand Up @@ -450,6 +451,7 @@ describe( 'ImageUploadEditing', () => {
it( 'should throw when other error happens during upload', done => {
const file = createNativeFileMock();
const error = new Error( 'Foo bar baz' );
error.stack = 'biz';
const uploadEditing = editor.plugins.get( ImageUploadEditing );
const loadSpy = sinon.spy( uploadEditing, '_readAndUpload' );
const catchSpy = sinon.spy();
Expand All @@ -476,7 +478,16 @@ describe( 'ImageUploadEditing', () => {

setTimeout( () => {
sinon.assert.calledOnce( catchSpy );
sinon.assert.calledWithExactly( catchSpy, error );
const error = catchSpy.getCall( 0 ).args[ 0 ];

assertCKEditorError( error, /unexpected-error/, editor, {
originalError: {
name: 'Error',
message: 'Foo bar baz',
stack: 'biz'
}
} );

done();
}, 0 );
} );
Expand Down

0 comments on commit 82871a7

Please sign in to comment.