diff options
| -rw-r--r-- | app/assets/javascripts/dropzone_input.js | 66 | ||||
| -rw-r--r-- | changelogs/unreleased/jivl-fix-cancel-button-file-upload-new-issue.yml | 5 | ||||
| -rw-r--r-- | spec/features/issues_spec.rb | 10 |
3 files changed, 81 insertions, 0 deletions
diff --git a/app/assets/javascripts/dropzone_input.js b/app/assets/javascripts/dropzone_input.js index bd45da8c422..c0645c48cfe 100644 --- a/app/assets/javascripts/dropzone_input.js +++ b/app/assets/javascripts/dropzone_input.js @@ -117,8 +117,74 @@ window.DropzoneInput = (function() { $('.dz-preview').remove(); $('.markdown-area').trigger('input'); +<<<<<<< HEAD $uploadingProgressContainer.addClass('hide'); $cancelButton.addClass('hide'); +======= + $uploadingErrorContainer.removeClass('hide'); + $uploadingErrorMessage.html(message); + $attachButton.addClass('hide'); + $cancelButton.addClass('hide'); + }, + totaluploadprogress(totalUploadProgress) { + updateAttachingMessage(this.files, $attachingFileMessage); + $uploadProgress.text(`${Math.round(totalUploadProgress)}%`); + }, + sending: () => { + // DOM elements already exist. + // Instead of dynamically generating them, + // we just either hide or show them. + $attachButton.addClass('hide'); + $uploadingErrorContainer.addClass('hide'); + $uploadingProgressContainer.removeClass('hide'); + $cancelButton.removeClass('hide'); + }, + removedfile: () => { + $attachButton.removeClass('hide'); + $cancelButton.addClass('hide'); + $uploadingProgressContainer.addClass('hide'); + $uploadingErrorContainer.addClass('hide'); + }, + queuecomplete: () => { + $('.dz-preview').remove(); + $('.markdown-area').trigger('input'); + + $uploadingProgressContainer.addClass('hide'); + $cancelButton.addClass('hide'); + }, + }); + + const child = $(dropzone[0]).children('textarea'); + + // removeAllFiles(true) stops uploading files (if any) + // and remove them from dropzone files queue. + $cancelButton.on('click', (e) => { + e.preventDefault(); + e.stopPropagation(); + Dropzone.forElement($formDropzone.get(0)).removeAllFiles(true); + }); + + // If 'error' event is fired, we store a failed files, + // clear dropzone files queue, change status of failed files to undefined, + // and add that files to the dropzone files queue again. + // addFile() adds file to dropzone files queue and upload it. + $retryLink.on('click', (e) => { + const dropzoneInstance = Dropzone.forElement(e.target.closest('.js-main-target-form').querySelector('.div-dropzone')); + const failedFiles = dropzoneInstance.files; + + e.preventDefault(); + + // 'true' parameter of removeAllFiles() cancels + // uploading of files that are being uploaded at the moment. + dropzoneInstance.removeAllFiles(true); + + failedFiles.map((failedFile) => { + const file = failedFile; + + if (file.status === Dropzone.ERROR) { + file.status = undefined; + file.accepted = undefined; +>>>>>>> 95f9f05378... Merge branch 'jivl-fix-cancel-button-file-upload-new-issue' into 'master' } }); diff --git a/changelogs/unreleased/jivl-fix-cancel-button-file-upload-new-issue.yml b/changelogs/unreleased/jivl-fix-cancel-button-file-upload-new-issue.yml new file mode 100644 index 00000000000..0205d9626b1 --- /dev/null +++ b/changelogs/unreleased/jivl-fix-cancel-button-file-upload-new-issue.yml @@ -0,0 +1,5 @@ +--- +title: Fix cancel button not working while uploading on the new issue page +merge_request: 15137 +author: +type: fixed diff --git a/spec/features/issues_spec.rb b/spec/features/issues_spec.rb index d4fd3a50008..9b94452fb0d 100644 --- a/spec/features/issues_spec.rb +++ b/spec/features/issues_spec.rb @@ -583,6 +583,16 @@ describe 'Issues' do expect(page.find_field("issue_description").value).not_to match /\n\n$/ end + + it "cancels a file upload correctly" do + dropzone_file([Rails.root.join('spec', 'fixtures', 'dk.png')], 0, false) + + click_button 'Cancel' + + expect(page).to have_button('Attach a file') + expect(page).not_to have_button('Cancel') + expect(page).not_to have_selector('.uploading-progress-container', visible: true) + end end context 'form filled by URL parameters' do |