Merge branch 'disable-btn-mr-when-posting-comment' into 'master'

Disables the button when submitting comment.

Closes #39661

See merge request gitlab-org/gitlab-ce!17918

2 files changed, 17 insertions, 2 deletions

diff --git a/app/assets/javascripts/notes.js b/app/assets/javascripts/notes.js
index 2afa4e4c1bf..09f0ea37103 100644
--- a/app/assets/javascripts/notes.js
+++ b/app/assets/javascripts/notes.js
@@ -1727,6 +1727,7 @@ export default class Notes {
 
     // Get Form metadata
     const $submitBtn = $(e.target);
+    $submitBtn.prop('disabled', true);
     let $form = $submitBtn.parents('form');
     const $closeBtn = $form.find('.js-note-target-close');
     const isDiscussionNote =
@@ -1761,7 +1762,6 @@ export default class Notes {
     // If comment is to resolve discussion, disable submit buttons while
     // comment posting is finished.
     if (isDiscussionResolve) {
-      $submitBtn.disable();
       $form.find('.js-comment-submit-button').disable();
     }
 
@@ -1816,6 +1816,7 @@ export default class Notes {
       .then(res => {
         const note = res.data;
 
+        $submitBtn.prop('disabled', false);
         // Submission successful! remove placeholder
         $notesContainer.find(`#${noteUniqueId}`).remove();
 
@@ -1899,7 +1900,7 @@ export default class Notes {
       .catch(() => {
         // Submission failed, remove placeholder note and show Flash error message
         $notesContainer.find(`#${noteUniqueId}`).remove();
-
+        $submitBtn.prop('disabled', false);
         const blurEvent = new CustomEvent('blur.imageDiff', {
           detail: e,
         });
diff --git a/spec/javascripts/notes_spec.js b/spec/javascripts/notes_spec.js
index 8f317b06792..1858d6b6474 100644
--- a/spec/javascripts/notes_spec.js
+++ b/spec/javascripts/notes_spec.js
@@ -549,6 +549,20 @@ import timeoutPromise from './helpers/set_timeout_promise_helper';
         });
       });
 
+      it('should disable the submit button when comment button is clicked', (done) => {
+        expect($form.find('.js-comment-submit-button').is(':disabled')).toEqual(false);
+
+        mockNotesPost();
+        $('.js-comment-button').click();
+        expect($form.find('.js-comment-submit-button').is(':disabled')).toEqual(true);
+
+        setTimeout(() => {
+          expect($form.find('.js-comment-submit-button').is(':disabled')).toEqual(false);
+
+          done();
+        });
+      });
+
       it('should show actual note element when new comment is done posting', (done) => {
         mockNotesPost();