Add latest changes from gitlab-org/gitlab@master

3 files changed, 87 insertions, 37 deletions

diff --git a/spec/frontend/confidential_merge_request/components/dropdown_spec.js b/spec/frontend/confidential_merge_request/components/dropdown_spec.js
index 770f2636648..4d577fe1132 100644
--- a/spec/frontend/confidential_merge_request/components/dropdown_spec.js
+++ b/spec/frontend/confidential_merge_request/components/dropdown_spec.js
@@ -1,47 +1,79 @@
-import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
-import { mount } from '@vue/test-utils';
+import { GlCollapsibleListbox } from '@gitlab/ui';
+import { shallowMount } from '@vue/test-utils';
 import Dropdown from '~/confidential_merge_request/components/dropdown.vue';
 
-let vm;
+const TEST_PROJECTS = [
+  {
+    id: 7,
+    name: 'test',
+  },
+  {
+    id: 9,
+    name: 'lorem ipsum',
+  },
+  {
+    id: 11,
+    name: 'dolar sit',
+  },
+];
 
-function factory(projects = []) {
-  vm = mount(Dropdown, {
-    propsData: {
-      projects,
-      selectedProject: projects[0],
-    },
-  });
-}
-
-describe('Confidential merge request project dropdown component', () => {
-  afterEach(() => {
-    vm.destroy();
-  });
+describe('~/confidential_merge_request/components/dropdown.vue', () => {
+  let wrapper;
 
-  it('renders dropdown items', () => {
-    factory([
-      {
-        id: 1,
-        name: 'test',
-      },
-      {
-        id: 2,
-        name: 'test',
+  function factory(props = {}) {
+    wrapper = shallowMount(Dropdown, {
+      propsData: {
+        projects: TEST_PROJECTS,
+        ...props,
       },
-    ]);
+    });
+  }
 
-    expect(vm.findAllComponents(GlDropdownItem).length).toBe(2);
-  });
+  const findListbox = () => wrapper.findComponent(GlCollapsibleListbox);
+
+  describe('default', () => {
+    beforeEach(() => {
+      factory();
+    });
+
+    it('renders collapsible listbox', () => {
+      expect(findListbox().props()).toMatchObject({
+        icon: 'lock',
+        selected: [],
+        toggleText: 'Select private project',
+        block: true,
+        items: TEST_PROJECTS.map(({ id, name }) => ({
+          value: String(id),
+          text: name,
+        })),
+      });
+    });
+
+    it('does not emit anything', () => {
+      expect(wrapper.emitted()).toEqual({});
+    });
 
-  it('shows lock icon', () => {
-    factory();
+    describe('when listbox emits selected', () => {
+      beforeEach(() => {
+        findListbox().vm.$emit('select', String(TEST_PROJECTS[1].id));
+      });
 
-    expect(vm.findComponent(GlDropdown).props('icon')).toBe('lock');
+      it('emits selected project', () => {
+        expect(wrapper.emitted('select')).toEqual([[TEST_PROJECTS[1]]]);
+      });
+    });
   });
 
-  it('has dropdown text', () => {
-    factory();
+  describe('with selected', () => {
+    beforeEach(() => {
+      factory({ selectedProject: TEST_PROJECTS[1] });
+    });
 
-    expect(vm.findComponent(GlDropdown).props('text')).toBe('Select private project');
+    it('shows selected project', () => {
+      expect(findListbox().props()).toMatchObject({
+        selected: String(TEST_PROJECTS[1].id),
+        toggleText: TEST_PROJECTS[1].name,
+      });
+    });
   });
 });
diff --git a/spec/frontend/issues/show/components/incidents/timeline_events_item_spec.js b/spec/frontend/issues/show/components/incidents/timeline_events_item_spec.js
index acff5d9ed43..24653a23036 100644
--- a/spec/frontend/issues/show/components/incidents/timeline_events_item_spec.js
+++ b/spec/frontend/issues/show/components/incidents/timeline_events_item_spec.js
@@ -9,8 +9,8 @@ import { mockEvents } from './mock_data';
 describe('IncidentTimelineEventList', () => {
   let wrapper;
 
-  const mountComponent = ({ propsData, provide } = {}) => {
-    const { action, noteHtml, occurredAt } = mockEvents[0];
+  const mountComponent = ({ propsData, provide, mockEvent = mockEvents[0] } = {}) => {
+    const { action, noteHtml, occurredAt } = mockEvent;
     wrapper = mountExtended(IncidentTimelineEventItem, {
       propsData: {
         action,
@@ -30,6 +30,7 @@ describe('IncidentTimelineEventList', () => {
   const findEventTags = () => wrapper.findAllComponents(GlBadge);
   const findDropdown = () => wrapper.findComponent(GlDropdown);
   const findDeleteButton = () => wrapper.findByText(timelineItemI18n.delete);
+  const findEditButton = () => wrapper.findByText(timelineItemI18n.edit);
 
   describe('template', () => {
     beforeEach(() => {
@@ -88,6 +89,21 @@ describe('IncidentTimelineEventList', () => {
         expect(findDeleteButton().exists()).toBe(false);
       });
 
+      it('does not show edit item when event was system generated', () => {
+        const systemGeneratedMockEvent = {
+          ...mockEvents[0],
+          action: 'status',
+        };
+
+        mountComponent({
+          provide: { canUpdateTimelineEvent: true },
+          mockEvent: systemGeneratedMockEvent,
+        });
+
+        expect(findDropdown().exists()).toBe(true);
+        expect(findEditButton().exists()).toBe(false);
+      });
+
       it('shows dropdown and delete item when user has update permission', () => {
         mountComponent({ provide: { canUpdateTimelineEvent: true } });
 
diff --git a/spec/frontend/issues/show/components/incidents/timeline_events_tab_spec.js b/spec/frontend/issues/show/components/incidents/timeline_events_tab_spec.js
index 5bac1d6e7ad..63474070701 100644
--- a/spec/frontend/issues/show/components/incidents/timeline_events_tab_spec.js
+++ b/spec/frontend/issues/show/components/incidents/timeline_events_tab_spec.js
@@ -112,7 +112,9 @@ describe('TimelineEventsTab', () => {
       await waitForPromises();
 
       expect(findEmptyState().exists()).toBe(false);
-      expect(findTimelineEventsList().props('timelineEvents')).toHaveLength(3);
+      expect(findTimelineEventsList().props('timelineEvents')).toHaveLength(
+        timelineEventsQueryListResponse.data.project.incidentManagementTimelineEvents.nodes.length,
+      );
     });
   });