Update discussion notes spec

1 files changed, 31 insertions, 8 deletions

diff --git a/spec/frontend/notes/components/discussion_notes_spec.js b/spec/frontend/notes/components/discussion_notes_spec.js
index d72e0131792..392c1b6533e 100644
--- a/spec/frontend/notes/components/discussion_notes_spec.js
+++ b/spec/frontend/notes/components/discussion_notes_spec.js
@@ -1,4 +1,4 @@
-import { shallowMount, createLocalVue } from '@vue/test-utils';
+import { mount, createLocalVue } from '@vue/test-utils';
 import '~/behaviors/markdown/render_gfm';
 import { SYSTEM_NOTE } from '~/notes/constants';
 import DiscussionNotes from '~/notes/components/discussion_notes.vue';
@@ -6,6 +6,7 @@ import NoteableNote from '~/notes/components/noteable_note.vue';
 import PlaceholderNote from '~/vue_shared/components/notes/placeholder_note.vue';
 import PlaceholderSystemNote from '~/vue_shared/components/notes/placeholder_system_note.vue';
 import SystemNote from '~/vue_shared/components/notes/system_note.vue';
+import TimelineEntryItem from '~/vue_shared/components/notes/timeline_entry_item.vue';
 import createStore from '~/notes/stores';
 import {
   noteableDataMock,
@@ -23,7 +24,7 @@ describe('DiscussionNotes', () => {
     store.dispatch('setNoteableData', noteableDataMock);
     store.dispatch('setNotesData', notesDataMock);
 
-    wrapper = shallowMount(DiscussionNotes, {
+    wrapper = mount(DiscussionNotes, {
       localVue,
       store,
       propsData: {
@@ -32,28 +33,31 @@ describe('DiscussionNotes', () => {
         shouldGroupReplies: false,
         ...props,
       },
+      scopedSlots: {
+        footer: '<p slot-scope="{ showReplies }">showReplies:{{showReplies}}</p>',
+      },
+      slots: {
+        'avatar-badge': '<span class="avatar-badge-slot-content" />',
+      },
       sync: false,
     });
   };
 
-  beforeEach(() => {
-    createComponent();
-  });
-
   afterEach(() => {
     wrapper.destroy();
   });
 
   describe('rendering', () => {
     it('renders an element for each note in the discussion', () => {
+      createComponent();
       const notesCount = discussionMock.notes.length;
-      const els = wrapper.findAll('.notes > li');
+      const els = wrapper.findAll(TimelineEntryItem);
       expect(els.length).toBe(notesCount);
     });
 
     it('renders one element if replies groupping is enabled', () => {
       createComponent({ shouldGroupReplies: true });
-      const els = wrapper.findAll('.notes > li');
+      const els = wrapper.findAll(TimelineEntryItem);
       expect(els.length).toBe(1);
     });
 
@@ -91,9 +95,28 @@ describe('DiscussionNotes', () => {
       expect(notes.at(2).is(SystemNote)).toBe(true);
       expect(notes.at(3).is(NoteableNote)).toBe(true);
     });
+
+    it('renders footer scoped slot with showReplies === true when expanded', () => {
+      createComponent({ isExpanded: true });
+      expect(wrapper.text()).toMatch('showReplies:true');
+    });
+
+    it('renders footer scoped slot with showReplies === false when collapsed', () => {
+      createComponent({ isExpanded: false });
+      expect(wrapper.text()).toMatch('showReplies:false');
+    });
+
+    it('passes down avatar-badge slot content', () => {
+      createComponent();
+      expect(wrapper.find('.avatar-badge-slot-content').exists()).toBe(true);
+    });
   });
 
   describe('componentData', () => {
+    beforeEach(() => {
+      createComponent();
+    });
+
     it('should return first note object for placeholder note', () => {
       const data = {
         isPlaceholderNote: true,