Add latest changes from gitlab-org/gitlab@16-2-stable-eev16.2.0-rc42

3 files changed, 90 insertions, 50 deletions

diff --git a/spec/frontend/batch_comments/components/draft_note_spec.js b/spec/frontend/batch_comments/components/draft_note_spec.js
index 159e36c1364..b6042b4aa81 100644
--- a/spec/frontend/batch_comments/components/draft_note_spec.js
+++ b/spec/frontend/batch_comments/components/draft_note_spec.js
@@ -41,9 +41,11 @@ describe('Batch comments draft note component', () => {
       },
     });
 
-    jest.spyOn(wrapper.vm.$store, 'dispatch').mockImplementation();
+    jest.spyOn(store, 'dispatch').mockImplementation();
   };
 
+  const findNoteableNote = () => wrapper.findComponent(NoteableNote);
+
   beforeEach(() => {
     store = createStore();
     draft = createDraft();
@@ -53,32 +55,28 @@ describe('Batch comments draft note component', () => {
     createComponent();
     expect(wrapper.findComponent(GlBadge).exists()).toBe(true);
 
-    const note = wrapper.findComponent(NoteableNote);
-
-    expect(note.exists()).toBe(true);
-    expect(note.props().note).toEqual(draft);
+    expect(findNoteableNote().exists()).toBe(true);
+    expect(findNoteableNote().props('note')).toEqual(draft);
   });
 
   describe('update', () => {
     it('dispatches updateDraft', async () => {
       createComponent();
-      const note = wrapper.findComponent(NoteableNote);
-
-      note.vm.$emit('handleEdit');
+      findNoteableNote().vm.$emit('handleEdit');
 
       await nextTick();
       const formData = {
         note: draft,
         noteText: 'a',
         resolveDiscussion: false,
+        callback: jest.fn(),
+        parentElement: wrapper.vm.$el,
+        errorCallback: jest.fn(),
       };
 
-      note.vm.$emit('handleUpdateNote', formData);
+      findNoteableNote().vm.$emit('handleUpdateNote', formData);
 
-      expect(wrapper.vm.$store.dispatch).toHaveBeenCalledWith(
-        'batchComments/updateDraft',
-        formData,
-      );
+      expect(store.dispatch).toHaveBeenCalledWith('batchComments/updateDraft', formData);
     });
   });
 
@@ -87,18 +85,15 @@ describe('Batch comments draft note component', () => {
       createComponent();
       jest.spyOn(window, 'confirm').mockImplementation(() => true);
 
-      const note = wrapper.findComponent(NoteableNote);
-
-      note.vm.$emit('handleDeleteNote', draft);
+      findNoteableNote().vm.$emit('handleDeleteNote', draft);
 
-      expect(wrapper.vm.$store.dispatch).toHaveBeenCalledWith('batchComments/deleteDraft', draft);
+      expect(store.dispatch).toHaveBeenCalledWith('batchComments/deleteDraft', draft);
     });
   });
 
   describe('quick actions', () => {
     it('renders referenced commands', async () => {
-      createComponent();
-      wrapper.setProps({
+      createComponent({
         draft: {
           ...draft,
           references: {
@@ -116,22 +111,27 @@ describe('Batch comments draft note component', () => {
   });
 
   describe('multiline comments', () => {
-    describe.each`
-      desc                          | props                 | event           | expectedCalls
-      ${'with `draft.position`'}    | ${draftWithLineRange} | ${'mouseenter'} | ${[['setSelectedCommentPositionHover', LINE_RANGE]]}
-      ${'with `draft.position`'}    | ${draftWithLineRange} | ${'mouseleave'} | ${[['setSelectedCommentPositionHover']]}
-      ${'without `draft.position`'} | ${{}}                 | ${'mouseenter'} | ${[]}
-      ${'without `draft.position`'} | ${{}}                 | ${'mouseleave'} | ${[]}
-    `('$desc', ({ props, event, expectedCalls }) => {
-      beforeEach(() => {
-        createComponent({ draft: { ...draft, ...props } });
-        jest.spyOn(store, 'dispatch');
-      });
+    it(`calls store with draft.position with mouseenter`, () => {
+      createComponent({ draft: { ...draft, ...draftWithLineRange } });
+      findNoteableNote().trigger('mouseenter');
 
-      it(`calls store ${expectedCalls.length} times on ${event}`, () => {
-        wrapper.element.dispatchEvent(new MouseEvent(event, { bubbles: true }));
-        expect(store.dispatch.mock.calls).toEqual(expectedCalls);
-      });
+      expect(store.dispatch).toHaveBeenCalledWith('setSelectedCommentPositionHover', LINE_RANGE);
+    });
+
+    it(`calls store with draft.position and mouseleave`, () => {
+      createComponent({ draft: { ...draft, ...draftWithLineRange } });
+      findNoteableNote().trigger('mouseleave');
+
+      expect(store.dispatch).toHaveBeenCalledWith('setSelectedCommentPositionHover');
+    });
+
+    it(`does not call store without draft position`, () => {
+      createComponent({ draft });
+
+      findNoteableNote().trigger('mouseenter');
+      findNoteableNote().trigger('mouseleave');
+
+      expect(store.dispatch).not.toHaveBeenCalled();
     });
   });
 });
diff --git a/spec/frontend/batch_comments/components/submit_dropdown_spec.js b/spec/frontend/batch_comments/components/submit_dropdown_spec.js
index 5c33df882bf..7e2ff7f786f 100644
--- a/spec/frontend/batch_comments/components/submit_dropdown_spec.js
+++ b/spec/frontend/batch_comments/components/submit_dropdown_spec.js
@@ -3,6 +3,7 @@ import Vue from 'vue';
 import Vuex from 'vuex';
 import { mountExtended } from 'helpers/vue_test_utils_helper';
 import SubmitDropdown from '~/batch_comments/components/submit_dropdown.vue';
+import { mockTracking } from 'helpers/tracking_helper';
 
 jest.mock('~/autosave');
 
@@ -10,9 +11,11 @@ Vue.use(Vuex);
 
 let wrapper;
 let publishReview;
+let trackingSpy;
 
 function factory({ canApprove = true, shouldAnimateReviewButton = false } = {}) {
   publishReview = jest.fn();
+  trackingSpy = mockTracking(undefined, null, jest.spyOn);
 
   const store = new Vuex.Store({
     getters: {
@@ -69,6 +72,20 @@ describe('Batch comments submit dropdown', () => {
     });
   });
 
+  it('tracks submit action', () => {
+    factory();
+
+    findCommentTextarea().setValue('Hello world');
+
+    findForm().vm.$emit('submit', { preventDefault: jest.fn() });
+
+    expect(trackingSpy).toHaveBeenCalledWith(undefined, 'editor_type_used', {
+      context: 'MergeRequest_review',
+      editorType: 'editor_type_plain_text_editor',
+      label: 'editor_tracking',
+    });
+  });
+
   it('switches to the overview tab after submit', async () => {
     window.mrTabs = { tabShown: jest.fn() };
 
diff --git a/spec/frontend/batch_comments/stores/modules/batch_comments/actions_spec.js b/spec/frontend/batch_comments/stores/modules/batch_comments/actions_spec.js
index 521bbf06b02..824b2a296c6 100644
--- a/spec/frontend/batch_comments/stores/modules/batch_comments/actions_spec.js
+++ b/spec/frontend/batch_comments/stores/modules/batch_comments/actions_spec.js
@@ -1,10 +1,15 @@
 import MockAdapter from 'axios-mock-adapter';
 import { TEST_HOST } from 'helpers/test_constants';
 import testAction from 'helpers/vuex_action_helper';
+import { sprintf } from '~/locale';
+import { createAlert } from '~/alert';
 import service from '~/batch_comments/services/drafts_service';
 import * as actions from '~/batch_comments/stores/modules/batch_comments/actions';
 import axios from '~/lib/utils/axios_utils';
 import { HTTP_STATUS_INTERNAL_SERVER_ERROR, HTTP_STATUS_OK } from '~/lib/utils/http_status';
+import { UPDATE_COMMENT_FORM } from '~/notes/i18n';
+
+jest.mock('~/alert');
 
 describe('Batch comments store actions', () => {
   let res = {};
@@ -44,15 +49,15 @@ describe('Batch comments store actions', () => {
     });
 
     it('does not commit ADD_NEW_DRAFT if errors returned', () => {
+      const commit = jest.fn();
+
       mock.onAny().reply(HTTP_STATUS_INTERNAL_SERVER_ERROR);
 
-      return testAction(
-        actions.addDraftToDiscussion,
-        { endpoint: TEST_HOST, data: 'test' },
-        null,
-        [],
-        [],
-      );
+      return actions
+        .addDraftToDiscussion({ commit }, { endpoint: TEST_HOST, data: 'test' })
+        .catch(() => {
+          expect(commit).not.toHaveBeenCalledWith('ADD_NEW_DRAFT', expect.anything());
+        });
     });
   });
 
@@ -84,15 +89,13 @@ describe('Batch comments store actions', () => {
     });
 
     it('does not commit ADD_NEW_DRAFT if errors returned', () => {
+      const commit = jest.fn();
+
       mock.onAny().reply(HTTP_STATUS_INTERNAL_SERVER_ERROR);
 
-      return testAction(
-        actions.createNewDraft,
-        { endpoint: TEST_HOST, data: 'test' },
-        null,
-        [],
-        [],
-      );
+      return actions.createNewDraft({ commit }, { endpoint: TEST_HOST, data: 'test' }).catch(() => {
+        expect(commit).not.toHaveBeenCalledWith('ADD_NEW_DRAFT', expect.anything());
+      });
     });
   });
 
@@ -239,8 +242,6 @@ describe('Batch comments store actions', () => {
       params = { note: { id: 1 }, noteText: 'test' };
     });
 
-    afterEach(() => jest.clearAllMocks());
-
     it('commits RECEIVE_DRAFT_UPDATE_SUCCESS with returned data', () => {
       return actions.updateDraft(context, { ...params, callback() {} }).then(() => {
         expect(commit).toHaveBeenCalledWith('RECEIVE_DRAFT_UPDATE_SUCCESS', { id: 1 });
@@ -267,6 +268,28 @@ describe('Batch comments store actions', () => {
         expect(service.update.mock.calls[0][1].position).toBe(expectation);
       });
     });
+
+    describe('when updating a draft returns an error', () => {
+      const errorCallback = jest.fn();
+      const flashContainer = null;
+      const error = 'server error';
+
+      beforeEach(async () => {
+        service.update.mockRejectedValue({ response: { data: { errors: error } } });
+        await actions.updateDraft(context, { ...params, flashContainer, errorCallback });
+      });
+
+      it('renders an error message', () => {
+        expect(createAlert).toHaveBeenCalledWith({
+          message: sprintf(UPDATE_COMMENT_FORM.error, { reason: error }),
+          parent: flashContainer,
+        });
+      });
+
+      it('calls errorCallback', () => {
+        expect(errorCallback).toHaveBeenCalledTimes(1);
+      });
+    });
   });
 
   describe('expandAllDiscussions', () => {