diff --git a/src/imageupload/imageuploadprogress.js b/src/imageupload/imageuploadprogress.js index 3e4e896b..1cc700f3 100644 --- a/src/imageupload/imageuploadprogress.js +++ b/src/imageupload/imageuploadprogress.js @@ -60,12 +60,12 @@ export default class ImageUploadProgress extends Plugin { const modelImage = data.item; const uploadId = modelImage.getAttribute( 'uploadId' ); - if ( !conversionApi.consumable.consume( data.item, evt.name ) || !uploadId ) { + if ( !conversionApi.consumable.consume( data.item, evt.name ) ) { return; } const fileRepository = editor.plugins.get( FileRepository ); - const status = data.attributeNewValue; + const status = uploadId ? data.attributeNewValue : null; const placeholder = this.placeholder; const viewFigure = editor.editing.mapper.toViewElement( modelImage ); const viewWriter = conversionApi.writer; diff --git a/tests/imageupload/imageuploadprogress.js b/tests/imageupload/imageuploadprogress.js index d092009e..77b9f4b3 100644 --- a/tests/imageupload/imageuploadprogress.js +++ b/tests/imageupload/imageuploadprogress.js @@ -137,6 +137,28 @@ describe( 'ImageUploadProgress', () => { ); } ); + it( 'should "clear" image when uploadId changes to null', () => { + setModelData( model, '' ); + const image = document.getRoot().getChild( 0 ); + + // Set attributes directly on image to simulate instant "uploading" status. + model.change( writer => { + writer.setAttribute( 'uploadStatus', 'uploading', image ); + writer.setAttribute( 'uploadId', '12345', image ); + } ); + + model.change( writer => { + writer.setAttribute( 'uploadStatus', null, image ); + writer.setAttribute( 'uploadId', null, image ); + } ); + + expect( getViewData( view ) ).to.equal( + '[
' + + `` + + '
]' + ); + } ); + it( 'should update progressbar width on progress', done => { setModelData( model, '[]foo' ); editor.execute( 'imageUpload', { file: createNativeFileMock() } );