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

Commit b3e2658

Browse files
niegowskiniegowski
committed
Tests: Aligned to changes in ckeditor5-clipboard.
1 parent 14a6102 commit b3e2658

File tree

1 file changed

+117
-108
lines changed

1 file changed

+117
-108
lines changed

‎tests/imageupload/imageuploadediting.js

Lines changed: 117 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -628,15 +628,6 @@ describe( 'ImageUploadEditing', () => {
628628
} );
629629

630630
it( 'should upload image with base64 src', done => {
631-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', () => {
632-
const id = adapterMocks[ 0 ].loader.id;
633-
const expected = '<paragraph>bar</paragraph>' +
634-
`[<image src="" uploadId="${ id }" uploadStatus="reading"></image>]` +
635-
'<paragraph>foo</paragraph>';
636-
637-
expectModel( done, getModelData( model ), expected );
638-
}, { priority: 'low' } );
639-
640631
setModelData( model, '<paragraph>[]foo</paragraph>' );
641632

642633
const clipboardHtml = `<p>bar</p><img src=${ base64Sample } />`;
@@ -646,17 +637,16 @@ describe( 'ImageUploadEditing', () => {
646637
const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
647638

648639
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
649-
} );
650640

651-
it( 'should upload image with blob src', done => {
652-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', () => {
653-
const id = adapterMocks[ 0 ].loader.id;
654-
const expected = `[<image src="" uploadId="${ id }" uploadStatus="reading"></image>]` +
655-
'<paragraph>foo</paragraph>';
641+
const id = adapterMocks[ 0 ].loader.id;
642+
const expected = '<paragraph>bar</paragraph>' +
643+
`[<image src="" uploadId="${ id }" uploadStatus="reading"></image>]` +
644+
'<paragraph>foo</paragraph>';
656645

657-
expectModel( done, getModelData( model ), expected );
658-
}, { priority: 'low' } );
646+
expectModel( done, getModelData( model ), expected );
647+
} );
659648

649+
it( 'should upload image with blob src', done => {
660650
setModelData( model, '<paragraph>[]foo</paragraph>' );
661651

662652
const clipboardHtml = `<img src=${ base64ToBlobUrl( base64Sample ) } />`;
@@ -666,15 +656,15 @@ describe( 'ImageUploadEditing', () => {
666656
const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
667657

668658
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
669-
} );
670659

671-
it( 'should not upload image if no loader available', done => {
672-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', () => {
673-
const expected = `[<image src="${ base64Sample }"></image>]<paragraph>foo</paragraph>`;
660+
const id = adapterMocks[ 0 ].loader.id;
661+
const expected = `[<image src="" uploadId="${ id }" uploadStatus="reading"></image>]` +
662+
'<paragraph>foo</paragraph>';
674663

675-
expectModel( done, getModelData( model ), expected );
676-
}, { priority: 'low' } );
664+
expectModel( done, getModelData( model ), expected );
665+
} );
677666

667+
it( 'should not upload image if no loader available', done => {
678668
sinon.stub( fileRepository, 'createLoader' ).callsFake( () => null );
679669

680670
setModelData( model, '<paragraph>[]foo</paragraph>' );
@@ -686,6 +676,10 @@ describe( 'ImageUploadEditing', () => {
686676
const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
687677

688678
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
679+
680+
const expected = `[<image src="${ base64Sample }"></image>]<paragraph>foo</paragraph>`;
681+
682+
expectModel( done, getModelData( model ), expected );
689683
} );
690684

691685
it( 'should not upload and remove image if fetch failed', done => {
@@ -696,14 +690,6 @@ describe( 'ImageUploadEditing', () => {
696690
evt.stop();
697691
}, { priority: 'high' } );
698692

699-
expectData(
700-
'<img src="" uploadId="#loader1_id" uploadProcessed="true"></img>',
701-
'[<image src="" uploadId="#loader1_id" uploadStatus="reading"></image>]<paragraph>foo</paragraph>',
702-
'<paragraph>[]foo</paragraph>',
703-
done,
704-
false
705-
);
706-
707693
setModelData( model, '<paragraph>[]foo</paragraph>' );
708694

709695
const clipboardHtml = `<img src=${ base64Sample } />`;
@@ -717,7 +703,21 @@ describe( 'ImageUploadEditing', () => {
717703
return new Promise( ( res, rej ) => rej( 'could not fetch' ) );
718704
} );
719705

706+
let content = null;
707+
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', ( evt, data ) => {
708+
content = data.content;
709+
} );
710+
720711
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
712+
713+
expectData(
714+
'<img src="" uploadId="#loader1_id" uploadProcessed="true"></img>',
715+
'[<image src="" uploadId="#loader1_id" uploadStatus="reading"></image>]<paragraph>foo</paragraph>',
716+
'<paragraph>[]foo</paragraph>',
717+
content,
718+
done,
719+
false
720+
);
721721
} );
722722

723723
it( 'should upload only images which were successfully fetched and remove failed ones', done => {
@@ -738,13 +738,6 @@ describe( 'ImageUploadEditing', () => {
738738
'[<image src="" uploadId="#loader2_id" uploadStatus="reading"></image>]' +
739739
'<paragraph>foo</paragraph>';
740740

741-
expectData(
742-
'',
743-
expectedModel,
744-
expectedFinalModel,
745-
done
746-
);
747-
748741
setModelData( model, '<paragraph>[]foo</paragraph>' );
749742

750743
const clipboardHtml = `<p>bar</p><img src=${ base64Sample } />` +
@@ -766,7 +759,20 @@ describe( 'ImageUploadEditing', () => {
766759
}
767760
} );
768761

762+
let content = null;
763+
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', ( evt, data ) => {
764+
content = data.content;
765+
} );
766+
769767
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
768+
769+
expectData(
770+
'',
771+
expectedModel,
772+
expectedFinalModel,
773+
content,
774+
done
775+
);
770776
} );
771777

772778
it( 'should not upload and remove image when `File` constructor is not present', done => {
@@ -781,26 +787,32 @@ describe( 'ImageUploadEditing', () => {
781787
evt.stop();
782788
}, { priority: 'high' } );
783789

790+
setModelData( model, '<paragraph>[]foo</paragraph>' );
791+
792+
const clipboardHtml = `<img src=${ base64ToBlobUrl( base64Sample ) } /><p>baz</p>`;
793+
const dataTransfer = mockDataTransfer( clipboardHtml );
794+
795+
const targetRange = model.createRange( model.createPositionAt( doc.getRoot(), 1 ), model.createPositionAt( doc.getRoot(), 1 ) );
796+
const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
797+
798+
let content = null;
799+
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', ( evt, data ) => {
800+
content = data.content;
801+
} );
802+
803+
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
804+
784805
expectData(
785806
'<img src="" uploadId="#loader1_id" uploadProcessed="true"></img><p>baz</p>',
786807
'<image src="" uploadId="#loader1_id" uploadStatus="reading"></image><paragraph>baz[]foo</paragraph>',
787808
'<paragraph>baz[]foo</paragraph>',
809+
content,
788810
err => {
789811
window.File = fileFn;
790812
done( err );
791813
},
792814
false
793815
);
794-
795-
setModelData( model, '<paragraph>[]foo</paragraph>' );
796-
797-
const clipboardHtml = `<img src=${ base64ToBlobUrl( base64Sample ) } /><p>baz</p>`;
798-
const dataTransfer = mockDataTransfer( clipboardHtml );
799-
800-
const targetRange = model.createRange( model.createPositionAt( doc.getRoot(), 1 ), model.createPositionAt( doc.getRoot(), 1 ) );
801-
const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
802-
803-
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
804816
} );
805817

806818
it( 'should not upload and remove image when `File` constructor is not supported', done => {
@@ -820,14 +832,6 @@ describe( 'ImageUploadEditing', () => {
820832
evt.stop();
821833
}, { priority: 'high' } );
822834

823-
expectData(
824-
'<p>baz</p><img src="" uploadId="#loader1_id" uploadProcessed="true"></img>',
825-
'<paragraph>baz</paragraph>[<image src="" uploadId="#loader1_id" uploadStatus="reading"></image>]<paragraph>foo</paragraph>',
826-
'<paragraph>baz[]</paragraph><paragraph>foo</paragraph>',
827-
done,
828-
false
829-
);
830-
831835
setModelData( model, '<paragraph>[]foo</paragraph>' );
832836

833837
const clipboardHtml = `<p>baz</p><img src=${ base64ToBlobUrl( base64Sample ) } />`;
@@ -836,17 +840,25 @@ describe( 'ImageUploadEditing', () => {
836840
const targetRange = model.createRange( model.createPositionAt( doc.getRoot(), 1 ), model.createPositionAt( doc.getRoot(), 1 ) );
837841
const targetViewRange = editor.editing.mapper.toViewRange( targetRange );
838842

843+
let content = null;
844+
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', ( evt, data ) => {
845+
content = data.content;
846+
} );
847+
839848
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
849+
850+
expectData(
851+
'<p>baz</p><img src="" uploadId="#loader1_id" uploadProcessed="true"></img>',
852+
'<paragraph>baz</paragraph>[<image src="" uploadId="#loader1_id" uploadStatus="reading"></image>]<paragraph>foo</paragraph>',
853+
'<paragraph>baz[]</paragraph><paragraph>foo</paragraph>',
854+
content,
855+
done,
856+
false
857+
);
840858
} );
841859

842860
// Skip this test on Edge as we mock `File` object there so there is no sense in testing it.
843861
( isEdgeEnv ? it.skip : it )( 'should get file extension from base64 string', done => {
844-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', () => {
845-
tryExpect( done, () => {
846-
loader.file.then( file => expect( file.name.split( '.' ).pop() ).to.equal( 'png' ) );
847-
} );
848-
}, { priority: 'low' } );
849-
850862
setModelData( model, '<paragraph>[]foo</paragraph>' );
851863

852864
const clipboardHtml = `<img src=${ base64Sample } />`;
@@ -865,16 +877,14 @@ describe( 'ImageUploadEditing', () => {
865877
} );
866878

867879
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
880+
881+
tryExpect( done, () => {
882+
loader.file.then( file => expect( file.name.split( '.' ).pop() ).to.equal( 'png' ) );
883+
} );
868884
} );
869885

870886
// Skip this test on Edge as we mock `File` object there so there is no sense in testing it.
871887
( isEdgeEnv ? it.skip : it )( 'should use fallback file extension', done => {
872-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', () => {
873-
tryExpect( done, () => {
874-
loader.file.then( file => expect( file.name.split( '.' ).pop() ).to.equal( 'jpeg' ) );
875-
} );
876-
}, { priority: 'low' } );
877-
878888
setModelData( model, '<paragraph>[]foo</paragraph>' );
879889

880890
const clipboardHtml = `<img src=${ base64ToBlobUrl( base64Sample ) } />`;
@@ -893,6 +903,10 @@ describe( 'ImageUploadEditing', () => {
893903
} );
894904

895905
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
906+
907+
tryExpect( done, () => {
908+
loader.file.then( file => expect( file.name.split( '.' ).pop() ).to.equal( 'jpeg' ) );
909+
} );
896910
} );
897911

898912
it( 'should not show notification when file loader failed with no error', done => {
@@ -905,19 +919,6 @@ describe( 'ImageUploadEditing', () => {
905919
evt.stop();
906920
}, { priority: 'high' } );
907921

908-
// Check data after paste.
909-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', () => {
910-
adapterMocks[ 0 ].loader.file.then( () => {
911-
expect.fail( 'Promise should be rejected.' );
912-
} ).catch( () => {
913-
// Deffer so the promise could be resolved.
914-
setTimeout( () => {
915-
expect( notificationsCount ).to.equal( 0 );
916-
done();
917-
} );
918-
} );
919-
}, { priority: 'low' } );
920-
921922
setModelData( model, '<paragraph>[]foo</paragraph>' );
922923

923924
const clipboardHtml = `<img src=${ base64Sample } />`;
@@ -930,6 +931,16 @@ describe( 'ImageUploadEditing', () => {
930931
sinon.stub( window, 'fetch' ).callsFake( () => Promise.reject() );
931932

932933
viewDocument.fire( 'clipboardInput', { dataTransfer, targetRanges: [ targetViewRange ] } );
934+
935+
adapterMocks[ 0 ].loader.file.then( () => {
936+
expect.fail( 'Promise should be rejected.' );
937+
} ).catch( () => {
938+
// Deffer so the promise could be resolved.
939+
setTimeout( () => {
940+
expect( notificationsCount ).to.equal( 0 );
941+
done();
942+
} );
943+
} );
933944
} );
934945

935946
// Helper for validating clipboard and model data as a result of a paste operation. This function checks both clipboard
@@ -939,39 +950,37 @@ describe( 'ImageUploadEditing', () => {
939950
// @param {String} expectedClipboardData Expected clipboard data on `inputTransformation` event.
940951
// @param {String} expectedModel Expected model data on `inputTransformation` event.
941952
// @param {String} expectedModelOnFile Expected model data after all `file.loader` promises are fetched.
953+
// @param {DocumentFragment} content Content processed in inputTransformation
942954
// @param {Function} doneFn Callback function to be called when all assertions are done or error occures.
943955
// @param {Boolean} [onSuccess=true] If `expectedModelOnFile` data should be validated
944956
// on `loader.file` a promise successful resolution or promise rejection.
945-
function expectData( expectedClipboardData, expectedModel, expectedModelOnFile, doneFn, onSuccess ) {
946-
// Check data after paste.
947-
editor.plugins.get( 'Clipboard' ).on( 'inputTransformation', ( evt, data ) => {
948-
const clipboardData = injectLoaderId( expectedClipboardData || '', adapterMocks );
949-
const modelData = injectLoaderId( expectedModel, adapterMocks );
950-
const finalModelData = injectLoaderId( expectedModelOnFile, adapterMocks );
957+
function expectData( expectedClipboardData, expectedModel, expectedModelOnFile, content, doneFn, onSuccess ) {
958+
const clipboardData = injectLoaderId( expectedClipboardData || '', adapterMocks );
959+
const modelData = injectLoaderId( expectedModel, adapterMocks );
960+
const finalModelData = injectLoaderId( expectedModelOnFile, adapterMocks );
951961

952-
if ( clipboardData.length ) {
953-
expect( stringifyView( data.content ) ).to.equal( clipboardData );
954-
}
955-
expect( getModelData( model ) ).to.equal( modelData );
956-
957-
if ( onSuccess !== false ) {
958-
adapterMocks[ 0 ].loader.file.then( () => {
959-
// Deffer so the promise could be resolved.
960-
setTimeout( () => {
961-
expectModel( doneFn, getModelData( model ), finalModelData );
962-
} );
962+
if ( clipboardData.length ) {
963+
expect( stringifyView( content ) ).to.equal( clipboardData );
964+
}
965+
expect( getModelData( model ) ).to.equal( modelData );
966+
967+
if ( onSuccess !== false ) {
968+
adapterMocks[ 0 ].loader.file.then( () => {
969+
// Deffer so the promise could be resolved.
970+
setTimeout( () => {
971+
expectModel( doneFn, getModelData( model ), finalModelData );
963972
} );
964-
} else {
965-
adapterMocks[ 0 ].loader.file.then( () => {
966-
expect.fail( 'The `loader.file` should be rejected.' );
967-
} ).catch( () => {
968-
// Deffer so the promise could be resolved.
969-
setTimeout( () => {
970-
expectModel( doneFn, getModelData( model ), finalModelData );
971-
} );
973+
} );
974+
} else {
975+
adapterMocks[ 0 ].loader.file.then( () => {
976+
expect.fail( 'The `loader.file` should be rejected.' );
977+
} ).catch( () => {
978+
// Deffer so the promise could be resolved.
979+
setTimeout( () => {
980+
expectModel( doneFn, getModelData( model ), finalModelData );
972981
} );
973-
}
974-
}, { priority: 'low' } );
982+
} );
983+
}
975984
}
976985
} );
977986

0 commit comments

Comments
 (0)