Merge branch '362947-fix-multiple-confirms-showing-on-diff-notes-cancel' into 'master'

Fix multiple modals showing when canceling comment in diff

See merge request gitlab-org/gitlab!88077

app/assets/javascripts/diffs/components/diff_line_note_form.vue

@@ -3,6 +3,7 @@ import { mapState, mapGetters, mapActions } from 'vuex';
 import { s__, __ } from '~/locale';
 import diffLineNoteFormMixin from '~/notes/mixins/diff_line_note_form';
 import { confirmAction } from '~/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal';
+import { ignoreWhilePending } from '~/lib/utils/ignore_while_pending';
 import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import MultilineCommentForm from '~/notes/components/multiline_comment_form.vue';
 import { commentLineOptions, formatLineRange } from '~/notes/components/multiline_comment_utils';
@@ -175,7 +176,10 @@ export default {
       'saveDiffDiscussion',
       'setSuggestPopoverDismissed',
     ]),
-    async handleCancelCommentForm(shouldConfirm, isDirty) {
+    handleCancelCommentForm: ignoreWhilePending(async function handleCancelCommentForm(
+      shouldConfirm,
+      isDirty,
+    ) {
       if (shouldConfirm && isDirty) {
         const msg = s__('Notes|Are you sure you want to cancel creating this comment?');
@@ -195,7 +199,7 @@ export default {
       this.$nextTick(() => {
         this.resetAutoSave();
       });
-    },
+    }),
     handleSaveNote(note) {
       return this.saveDiffDiscussion({ note, formData: this.formData }).then(() =>
         this.handleCancelCommentForm(),

spec/frontend/diffs/components/diff_line_note_form_spec.js

@@ -64,6 +64,16 @@ describe('DiffLineNoteForm', () => {
         expect(confirmAction).toHaveBeenCalled();
       });
+      it('should only ask for confirmation once', () => {
+        // Never resolve so we can test what happens when triggered while "confirmAction" is loading
+        confirmAction.mockImplementation(() => new Promise(() => {}));
+
+        findNoteForm().vm.$emit('cancelForm', true, true);
+        findNoteForm().vm.$emit('cancelForm', true, true);
+
+        expect(confirmAction).toHaveBeenCalledTimes(1);
+      });
+
       it('should not ask for confirmation when one of the params false', () => {
         confirmAction.mockResolvedValueOnce(false);