Add latest changes from gitlab-org/gitlab@master

4 files changed, 137 insertions, 5 deletions

diff --git a/spec/frontend/notes/components/comment_form_spec.js b/spec/frontend/notes/components/comment_form_spec.js
index 04143bb5b60..fb64551c76b 100644
--- a/spec/frontend/notes/components/comment_form_spec.js
+++ b/spec/frontend/notes/components/comment_form_spec.js
@@ -303,7 +303,7 @@ describe('issue_comment_form component', () => {
 
           await findCommentButton().trigger('click');
 
-          expect(findMarkdownEditor().find('textarea').attributes('disabled')).toBe('disabled');
+          expect(findMarkdownEditor().find('textarea').attributes('disabled')).toBeDefined();
         });
 
         it('should support quick actions', () => {
diff --git a/spec/frontend/notes/components/mr_discussion_filter_spec.js b/spec/frontend/notes/components/mr_discussion_filter_spec.js
new file mode 100644
index 00000000000..405043ff2a0
--- /dev/null
+++ b/spec/frontend/notes/components/mr_discussion_filter_spec.js
@@ -0,0 +1,110 @@
+import { mount } from '@vue/test-utils';
+import { GlCollapsibleListbox, GlListboxItem, GlButton } from '@gitlab/ui';
+import Vue, { nextTick } from 'vue';
+import Vuex from 'vuex';
+import DiscussionFilter from '~/notes/components/mr_discussion_filter.vue';
+import { MR_FILTER_OPTIONS } from '~/notes/constants';
+
+Vue.use(Vuex);
+
+describe('Merge request discussion filter component', () => {
+  let wrapper;
+  let store;
+  let updateMergeRequestFilters;
+  let setDiscussionSortDirection;
+
+  function createComponent(mergeRequestFilters = MR_FILTER_OPTIONS.map((f) => f.value)) {
+    updateMergeRequestFilters = jest.fn();
+    setDiscussionSortDirection = jest.fn();
+
+    store = new Vuex.Store({
+      modules: {
+        notes: {
+          state: {
+            mergeRequestFilters,
+            discussionSortOrder: 'asc',
+          },
+          actions: {
+            updateMergeRequestFilters,
+            setDiscussionSortDirection,
+          },
+        },
+      },
+    });
+
+    wrapper = mount(DiscussionFilter, {
+      store,
+    });
+  }
+
+  afterEach(() => {
+    localStorage.removeItem('mr_activity_filters');
+    localStorage.removeItem('sort_direction_merge_request');
+  });
+
+  describe('local sync sort direction', () => {
+    it('calls setDiscussionSortDirection when mounted', () => {
+      localStorage.setItem('sort_direction_merge_request', 'desc');
+
+      createComponent();
+
+      expect(setDiscussionSortDirection).toHaveBeenCalledWith(expect.anything(), {
+        direction: 'desc',
+      });
+    });
+  });
+
+  describe('local sync sort filters', () => {
+    it('calls setDiscussionSortDirection when mounted', () => {
+      localStorage.setItem('mr_activity_filters', '["comments"]');
+
+      createComponent();
+
+      expect(updateMergeRequestFilters).toHaveBeenCalledWith(expect.anything(), ['comments']);
+    });
+  });
+
+  it('lists current filters', () => {
+    createComponent();
+
+    expect(wrapper.findAllComponents(GlListboxItem).length).toBe(MR_FILTER_OPTIONS.length);
+  });
+
+  it('updates store when selecting filter', async () => {
+    createComponent();
+
+    wrapper.findComponent(GlListboxItem).vm.$emit('select');
+
+    await nextTick();
+
+    wrapper.findComponent(GlCollapsibleListbox).vm.$emit('hidden');
+
+    expect(updateMergeRequestFilters).toHaveBeenCalledWith(expect.anything(), [
+      'commit_branches',
+      'status',
+      'assignees_reviewers',
+      'edits',
+      'labels',
+      'mentions',
+      'tracking',
+      'comments',
+      'lock_status',
+    ]);
+  });
+
+  it.each`
+    state                                    | expectedText
+    ${['status']}                            | ${'Merge request status'}
+    ${['status', 'comments']}                | ${'Merge request status +1 more'}
+    ${[]}                                    | ${'None'}
+    ${MR_FILTER_OPTIONS.map((f) => f.value)} | ${'All activity'}
+  `('updates toggle text to $expectedText with $state', async ({ state, expectedText }) => {
+    createComponent();
+
+    store.state.notes.mergeRequestFilters = state;
+
+    await nextTick();
+
+    expect(wrapper.findComponent(GlButton).text()).toBe(expectedText);
+  });
+});
diff --git a/spec/frontend/notes/components/note_form_spec.js b/spec/frontend/notes/components/note_form_spec.js
index d6413d33c99..9423af4f058 100644
--- a/spec/frontend/notes/components/note_form_spec.js
+++ b/spec/frontend/notes/components/note_form_spec.js
@@ -177,7 +177,7 @@ describe('issue_note_form component', () => {
 
           await nextTick();
 
-          expect(textarea.attributes('disabled')).toBe('disabled');
+          expect(textarea.attributes('disabled')).toBeDefined();
         });
       });
     });
diff --git a/spec/frontend/notes/components/note_header_spec.js b/spec/frontend/notes/components/note_header_spec.js
index b3d6fab7f91..60ad9e3344a 100644
--- a/spec/frontend/notes/components/note_header_spec.js
+++ b/spec/frontend/notes/components/note_header_spec.js
@@ -19,7 +19,9 @@ describe('NoteHeader component', () => {
   const findTimestampLink = () => wrapper.findComponent({ ref: 'noteTimestampLink' });
   const findTimestamp = () => wrapper.findComponent({ ref: 'noteTimestamp' });
   const findInternalNoteIndicator = () => wrapper.findByTestId('internal-note-indicator');
+  const findAuthorName = () => wrapper.findByTestId('author-name');
   const findSpinner = () => wrapper.findComponent({ ref: 'spinner' });
+  const authorUsernameLink = () => wrapper.findComponent({ ref: 'authorUsernameLink' });
 
   const statusHtml =
     '"<span class="user-status-emoji has-tooltip" title="foo bar" data-html="true" data-placement="top"><gl-emoji title="basketball and hoop" data-name="basketball" data-unicode-version="6.0">🏀</gl-emoji></span>"';
@@ -35,6 +37,17 @@ describe('NoteHeader component', () => {
     status_tooltip_html: statusHtml,
   };
 
+  const supportBotAuthor = {
+    avatar_url: null,
+    id: 1,
+    name: 'Gitlab Support Bot',
+    path: '/support-bot',
+    state: 'active',
+    username: 'support-bot',
+    show_status: true,
+    status_tooltip_html: statusHtml,
+  };
+
   const createComponent = (props) => {
     wrapper = shallowMountExtended(NoteHeader, {
       store: new Vuex.Store({
@@ -114,6 +127,16 @@ describe('NoteHeader component', () => {
     expect(wrapper.text()).toContain('A deleted user');
   });
 
+  it('renders participant email when author is a support-bot', () => {
+    createComponent({
+      author: supportBotAuthor,
+      emailParticipant: 'email@example.com',
+    });
+
+    expect(findAuthorName().text()).toBe('email@example.com');
+    expect(authorUsernameLink().exists()).toBe(false);
+  });
+
   it('does not render created at information if createdAt is not passed as a prop', () => {
     createComponent();
 
@@ -204,16 +227,15 @@ describe('NoteHeader component', () => {
     it('toggles hover specific CSS classes on author name link', async () => {
       createComponent({ author });
 
-      const authorUsernameLink = wrapper.findComponent({ ref: 'authorUsernameLink' });
       const authorNameLink = wrapper.findComponent({ ref: 'authorNameLink' });
 
-      authorUsernameLink.trigger('mouseenter');
+      authorUsernameLink().trigger('mouseenter');
 
       await nextTick();
       expect(authorNameLink.classes()).toContain('hover');
       expect(authorNameLink.classes()).toContain('text-underline');
 
-      authorUsernameLink.trigger('mouseleave');
+      authorUsernameLink().trigger('mouseleave');
 
       await nextTick();
       expect(authorNameLink.classes()).not.toContain('hover');