Add latest changes from gitlab-org/gitlab@13-4-stable-ee

7 files changed, 83 insertions, 19 deletions

diff --git a/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap b/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap
index b1a718d58b5..13af29821d8 100644
--- a/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap
+++ b/spec/frontend/notes/components/__snapshots__/discussion_jump_to_next_button_spec.js.snap
@@ -12,7 +12,7 @@ exports[`JumpToNextDiscussionButton matches the snapshot 1`] = `
     data-track-property="click_next_unresolved_thread"
     title="Jump to next unresolved thread"
   >
-    <icon-stub
+    <gl-icon-stub
       name="comment-next"
       size="16"
     />
diff --git a/spec/frontend/notes/components/comment_form_spec.js b/spec/frontend/notes/components/comment_form_spec.js
index dc68c4371aa..59fa7b372ed 100644
--- a/spec/frontend/notes/components/comment_form_spec.js
+++ b/spec/frontend/notes/components/comment_form_spec.js
@@ -267,15 +267,14 @@ describe('issue_comment_form component', () => {
       });
 
       describe('when clicking close/reopen button', () => {
-        it('should disable button and show a loading spinner', done => {
+        it('should disable button and show a loading spinner', () => {
           const toggleStateButton = wrapper.find('.js-action-button');
 
           toggleStateButton.trigger('click');
-          wrapper.vm.$nextTick(() => {
-            expect(toggleStateButton.element.disabled).toEqual(true);
-            expect(toggleStateButton.find('.js-loading-button-icon').exists()).toBe(true);
 
-            done();
+          return wrapper.vm.$nextTick().then(() => {
+            expect(toggleStateButton.element.disabled).toEqual(true);
+            expect(toggleStateButton.props('loading')).toBe(true);
           });
         });
       });
@@ -321,4 +320,33 @@ describe('issue_comment_form component', () => {
       expect(wrapper.find('textarea').exists()).toBe(false);
     });
   });
+
+  describe('when issuable is open', () => {
+    beforeEach(() => {
+      setupStore(userDataMock, noteableDataMock);
+    });
+
+    it.each([['opened', 'warning'], ['reopened', 'warning']])(
+      'when %i, it changes the variant of the btn to %i',
+      (a, expected) => {
+        store.state.noteableData.state = a;
+
+        mountComponent();
+
+        expect(wrapper.find('.js-action-button').props('variant')).toBe(expected);
+      },
+    );
+  });
+
+  describe('when issuable is not open', () => {
+    beforeEach(() => {
+      setupStore(userDataMock, noteableDataMock);
+
+      mountComponent();
+    });
+
+    it('should render the "default" variant of the button', () => {
+      expect(wrapper.find('.js-action-button').props('variant')).toBe('warning');
+    });
+  });
 });
diff --git a/spec/frontend/notes/components/discussion_counter_spec.js b/spec/frontend/notes/components/discussion_counter_spec.js
index 04535aa17c5..affd6c1d1d2 100644
--- a/spec/frontend/notes/components/discussion_counter_spec.js
+++ b/spec/frontend/notes/components/discussion_counter_spec.js
@@ -1,5 +1,6 @@
 import Vuex from 'vuex';
 import { shallowMount, createLocalVue } from '@vue/test-utils';
+import { GlIcon } from '@gitlab/ui';
 import notesModule from '~/notes/stores/modules';
 import DiscussionCounter from '~/notes/components/discussion_counter.vue';
 import { noteableDataMock, discussionMock, notesDataMock, userDataMock } from '../mock_data';
@@ -112,13 +113,13 @@ describe('DiscussionCounter component', () => {
       updateStoreWithExpanded(true);
 
       expect(wrapper.vm.allExpanded).toBe(true);
-      expect(toggleAllButton.find({ name: 'angle-up' }).exists()).toBe(true);
+      expect(toggleAllButton.find(GlIcon).props().name).toBe('angle-up');
 
       toggleAllButton.trigger('click');
 
       return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.vm.allExpanded).toBe(false);
-        expect(toggleAllButton.find({ name: 'angle-down' }).exists()).toBe(true);
+        expect(toggleAllButton.find(GlIcon).props().name).toBe('angle-down');
       });
     });
 
@@ -126,13 +127,13 @@ describe('DiscussionCounter component', () => {
       updateStoreWithExpanded(false);
 
       expect(wrapper.vm.allExpanded).toBe(false);
-      expect(toggleAllButton.find({ name: 'angle-down' }).exists()).toBe(true);
+      expect(toggleAllButton.find(GlIcon).props().name).toBe('angle-down');
 
       toggleAllButton.trigger('click');
 
       return wrapper.vm.$nextTick().then(() => {
         expect(wrapper.vm.allExpanded).toBe(true);
-        expect(toggleAllButton.find({ name: 'angle-up' }).exists()).toBe(true);
+        expect(toggleAllButton.find(GlIcon).props().name).toBe('angle-up');
       });
     });
   });
diff --git a/spec/frontend/notes/components/discussion_filter_spec.js b/spec/frontend/notes/components/discussion_filter_spec.js
index 9a7896475e6..91ff796b9de 100644
--- a/spec/frontend/notes/components/discussion_filter_spec.js
+++ b/spec/frontend/notes/components/discussion_filter_spec.js
@@ -150,7 +150,7 @@ describe('DiscussionFilter component', () => {
       eventHub.$emit('MergeRequestTabChange', 'commit');
 
       wrapper.vm.$nextTick(() => {
-        expect(wrapper.isEmpty()).toBe(true);
+        expect(wrapper.html()).toBe('');
         done();
       });
     });
diff --git a/spec/frontend/notes/components/discussion_resolve_button_spec.js b/spec/frontend/notes/components/discussion_resolve_button_spec.js
index c64e299efc3..41701e54dfa 100644
--- a/spec/frontend/notes/components/discussion_resolve_button_spec.js
+++ b/spec/frontend/notes/components/discussion_resolve_button_spec.js
@@ -1,4 +1,5 @@
 import { shallowMount } from '@vue/test-utils';
+import { GlButton } from '@gitlab/ui';
 import resolveDiscussionButton from '~/notes/components/discussion_resolve_button.vue';
 
 const buttonTitle = 'Resolve discussion';
@@ -26,9 +27,9 @@ describe('resolveDiscussionButton', () => {
   });
 
   it('should emit a onClick event on button click', () => {
-    const button = wrapper.find({ ref: 'button' });
+    const button = wrapper.find(GlButton);
 
-    button.trigger('click');
+    button.vm.$emit('click');
 
     return wrapper.vm.$nextTick().then(() => {
       expect(wrapper.emitted()).toEqual({
@@ -38,7 +39,7 @@ describe('resolveDiscussionButton', () => {
   });
 
   it('should contain the provided button title', () => {
-    const button = wrapper.find({ ref: 'button' });
+    const button = wrapper.find(GlButton);
 
     expect(button.text()).toContain(buttonTitle);
   });
@@ -51,9 +52,9 @@ describe('resolveDiscussionButton', () => {
       },
     });
 
-    const button = wrapper.find({ ref: 'isResolvingIcon' });
+    const button = wrapper.find(GlButton);
 
-    expect(button.exists()).toEqual(true);
+    expect(button.props('loading')).toEqual(true);
   });
 
   it('should only show a loading spinner while resolving', () => {
@@ -64,10 +65,10 @@ describe('resolveDiscussionButton', () => {
       },
     });
 
-    const button = wrapper.find({ ref: 'isResolvingIcon' });
+    const button = wrapper.find(GlButton);
 
     wrapper.vm.$nextTick(() => {
-      expect(button.exists()).toEqual(false);
+      expect(button.props('loading')).toEqual(false);
     });
   });
 });
diff --git a/spec/frontend/notes/components/note_actions_spec.js b/spec/frontend/notes/components/note_actions_spec.js
index 97d1752726b..a79c3bbacb7 100644
--- a/spec/frontend/notes/components/note_actions_spec.js
+++ b/spec/frontend/notes/components/note_actions_spec.js
@@ -35,8 +35,12 @@ describe('noteActions', () => {
       canEdit: true,
       canAwardEmoji: true,
       canReportAsAbuse: true,
+      isAuthor: true,
+      isContributor: false,
+      noteableType: 'MergeRequest',
       noteId: '539',
       noteUrl: `${TEST_HOST}/group/project/-/merge_requests/1#note_1`,
+      projectName: 'project',
       reportAbusePath: `${TEST_HOST}/abuse_reports/new?ref_url=http%3A%2F%2Flocalhost%3A3000%2Fgitlab-org%2Fgitlab-ce%2Fissues%2F7%23note_539&user_id=26`,
       showReply: false,
     };
@@ -60,15 +64,43 @@ describe('noteActions', () => {
       wrapper = shallowMountNoteActions(props);
     });
 
+    it('should render noteable author badge', () => {
+      expect(
+        wrapper
+          .findAll('.note-role')
+          .at(0)
+          .text()
+          .trim(),
+      ).toEqual('Author');
+    });
+
     it('should render access level badge', () => {
       expect(
         wrapper
-          .find('.note-role')
+          .findAll('.note-role')
+          .at(1)
           .text()
           .trim(),
       ).toEqual(props.accessLevel);
     });
 
+    it('should render contributor badge', () => {
+      wrapper.setProps({
+        accessLevel: null,
+        isContributor: true,
+      });
+
+      return wrapper.vm.$nextTick().then(() => {
+        expect(
+          wrapper
+            .findAll('.note-role')
+            .at(1)
+            .text()
+            .trim(),
+        ).toBe('Contributor');
+      });
+    });
+
     it('should render emoji link', () => {
       expect(wrapper.find('.js-add-award').exists()).toBe(true);
       expect(wrapper.find('.js-add-award').attributes('data-position')).toBe('right');
diff --git a/spec/frontend/notes/components/notes_app_spec.js b/spec/frontend/notes/components/notes_app_spec.js
index fbfba2efb1d..c6034639a4a 100644
--- a/spec/frontend/notes/components/notes_app_spec.js
+++ b/spec/frontend/notes/components/notes_app_spec.js
@@ -330,6 +330,8 @@ describe('note_app', () => {
 
       wrapper.vm.$parent.$el.dispatchEvent(toggleAwardEvent);
 
+      jest.advanceTimersByTime(2);
+
       expect(toggleAwardAction).toHaveBeenCalledTimes(1);
       const [, payload] = toggleAwardAction.mock.calls[0];