1 files changed, 23 insertions, 32 deletions

diff --git a/spec/frontend/notes/components/noteable_note_spec.js b/spec/frontend/notes/components/noteable_note_spec.js
index 1e7470ace8e..5d81a7a9a0f 100644
--- a/spec/frontend/notes/components/noteable_note_spec.js
+++ b/spec/frontend/notes/components/noteable_note_spec.js
@@ -1,7 +1,7 @@
-import { mount } from '@vue/test-utils';
 import Vue, { nextTick } from 'vue';
 import Vuex from 'vuex';
 import { GlAvatar } from '@gitlab/ui';
+import { mountExtended } from 'helpers/vue_test_utils_helper';
 import waitForPromises from 'helpers/wait_for_promises';
 import DiffsModule from '~/diffs/store/modules';
 import NoteActions from '~/notes/components/note_actions.vue';
@@ -37,7 +37,9 @@ describe('issue_note', () => {
 
   const REPORT_ABUSE_PATH = '/abuse_reports/add_category';
 
-  const findMultilineComment = () => wrapper.find('[data-testid="multiline-comment"]');
+  const findNoteBody = () => wrapper.findComponent(NoteBody);
+
+  const findMultilineComment = () => wrapper.findByTestId('multiline-comment');
 
   const createWrapper = (props = {}, storeUpdater = (s) => s) => {
     store = new Vuex.Store(
@@ -52,7 +54,7 @@ describe('issue_note', () => {
     store.dispatch('setNoteableData', noteableDataMock);
     store.dispatch('setNotesData', notesDataMock);
 
-    wrapper = mount(issueNote, {
+    wrapper = mountExtended(issueNote, {
       store,
       propsData: {
         note,
@@ -250,21 +252,17 @@ describe('issue_note', () => {
     });
 
     it('should render issue body', () => {
-      const noteBody = wrapper.findComponent(NoteBody);
-      const noteBodyProps = noteBody.props();
-
-      expect(noteBodyProps.note).toBe(note);
-      expect(noteBodyProps.line).toBe(null);
-      expect(noteBodyProps.canEdit).toBe(note.current_user.can_edit);
-      expect(noteBodyProps.isEditing).toBe(false);
-      expect(noteBodyProps.helpPagePath).toBe('');
+      expect(findNoteBody().props().note).toBe(note);
+      expect(findNoteBody().props().line).toBe(null);
+      expect(findNoteBody().props().canEdit).toBe(note.current_user.can_edit);
+      expect(findNoteBody().props().isEditing).toBe(false);
+      expect(findNoteBody().props().helpPagePath).toBe('');
     });
 
     it('prevents note preview xss', async () => {
       const noteBody =
         '<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" onload="alert(1)" />';
       const alertSpy = jest.spyOn(window, 'alert').mockImplementation(() => {});
-      const noteBodyComponent = wrapper.findComponent(NoteBody);
 
       store.hotUpdate({
         modules: {
@@ -277,7 +275,7 @@ describe('issue_note', () => {
         },
       });
 
-      noteBodyComponent.vm.$emit('handleFormUpdate', {
+      findNoteBody().vm.$emit('handleFormUpdate', {
         noteText: noteBody,
         parentElement: null,
         callback: () => {},
@@ -285,7 +283,7 @@ describe('issue_note', () => {
 
       await waitForPromises();
       expect(alertSpy).not.toHaveBeenCalled();
-      expect(wrapper.vm.note.note_html).toBe(
+      expect(findNoteBody().props().note.note_html).toBe(
         '<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7">',
       );
     });
@@ -321,26 +319,21 @@ describe('issue_note', () => {
           },
         },
       });
-      const noteBody = wrapper.findComponent(NoteBody);
-      noteBody.vm.resetAutoSave = () => {};
 
-      noteBody.vm.$emit('handleFormUpdate', {
+      findNoteBody().vm.$emit('handleFormUpdate', {
         noteText: updatedText,
         parentElement: null,
         callback: () => {},
       });
 
       await nextTick();
-      let noteBodyProps = noteBody.props();
 
-      expect(noteBodyProps.note.note_html).toBe(`<p dir="auto">${updatedText}</p>\n`);
+      expect(findNoteBody().props().note.note_html).toBe(`<p dir="auto">${updatedText}</p>\n`);
 
-      noteBody.vm.$emit('cancelForm', {});
+      findNoteBody().vm.$emit('cancelForm', {});
       await nextTick();
 
-      noteBodyProps = noteBody.props();
-
-      expect(noteBodyProps.note.note_html).toBe(note.note_html);
+      expect(findNoteBody().props().note.note_html).toBe(note.note_html);
     });
   });
 
@@ -371,7 +364,7 @@ describe('issue_note', () => {
     it('responds to handleFormUpdate', () => {
       createWrapper();
       updateActions();
-      wrapper.findComponent(NoteBody).vm.$emit('handleFormUpdate', params);
+      findNoteBody().vm.$emit('handleFormUpdate', params);
       expect(wrapper.emitted('handleUpdateNote')).toHaveLength(1);
     });
 
@@ -380,16 +373,14 @@ describe('issue_note', () => {
 
       createWrapper();
       updateActions();
-      wrapper
-        .findComponent(NoteBody)
-        .vm.$emit('handleFormUpdate', { ...params, noteText: sensitiveMessage });
+      findNoteBody().vm.$emit('handleFormUpdate', { ...params, noteText: sensitiveMessage });
       expect(updateNote).not.toHaveBeenCalled();
     });
 
     it('does not stringify empty position', () => {
       createWrapper();
       updateActions();
-      wrapper.findComponent(NoteBody).vm.$emit('handleFormUpdate', params);
+      findNoteBody().vm.$emit('handleFormUpdate', params);
       expect(updateNote.mock.calls[0][1].note.note.position).toBeUndefined();
     });
 
@@ -398,7 +389,7 @@ describe('issue_note', () => {
       const expectation = JSON.stringify(position);
       createWrapper({ note: { ...note, position } });
       updateActions();
-      wrapper.findComponent(NoteBody).vm.$emit('handleFormUpdate', params);
+      findNoteBody().vm.$emit('handleFormUpdate', params);
       expect(updateNote.mock.calls[0][1].note.note.position).toBe(expectation);
     });
   });
@@ -423,7 +414,7 @@ describe('issue_note', () => {
 
         createWrapper({ note: noteDef, discussionFile: null }, storeUpdater);
 
-        expect(wrapper.vm.diffFile).toBe(null);
+        expect(findNoteBody().props().file).toBe(null);
       },
     );
 
@@ -441,7 +432,7 @@ describe('issue_note', () => {
         },
       );
 
-      expect(wrapper.vm.diffFile.testId).toBe('diffFileTest');
+      expect(findNoteBody().props().file.testId).toBe('diffFileTest');
     });
 
     it('returns the provided diff file if the more robust getters fail', () => {
@@ -457,7 +448,7 @@ describe('issue_note', () => {
         },
       );
 
-      expect(wrapper.vm.diffFile.testId).toBe('diffFileTest');
+      expect(findNoteBody().props().file.testId).toBe('diffFileTest');
     });
   });
 });