From 6e4e1050d9dba2b7b2523fdd1768823ab85feef4 Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Thu, 20 Aug 2020 18:42:06 +0000 Subject: Add latest changes from gitlab-org/gitlab@13-3-stable-ee --- .../__snapshots__/design_note_pin_spec.js.snap | 14 +- .../components/delete_button_spec.js | 4 +- .../design_notes/design_discussion_spec.js | 4 + .../list/__snapshots__/item_spec.js.snap | 331 +-------------------- .../design_management/components/list/item_spec.js | 51 ++-- .../__snapshots__/design_navigation_spec.js.snap | 35 +++ .../toolbar/__snapshots__/index_spec.js.snap | 76 ++--- .../__snapshots__/pagination_button_spec.js.snap | 28 -- .../toolbar/__snapshots__/pagination_spec.js.snap | 29 -- .../components/toolbar/design_navigation_spec.js | 79 +++++ .../components/toolbar/index_spec.js | 4 +- .../components/toolbar/pagination_button_spec.js | 61 ---- .../components/toolbar/pagination_spec.js | 79 ----- .../upload/__snapshots__/button_spec.js.snap | 30 +- .../__snapshots__/design_dropzone_spec.js.snap | 158 ++++++---- .../design_version_dropdown_spec.js.snap | 162 ++++------ .../components/upload/design_dropzone_spec.js | 25 +- .../upload/design_version_dropdown_spec.js | 16 +- .../components/upload/mock_data/all_versions.js | 12 +- .../design_management/mock_data/all_versions.js | 6 +- .../design_management/mock_data/apollo_mock.js | 106 +++++++ .../frontend/design_management/mock_data/design.js | 12 +- .../design_management/mock_data/designs.js | 6 +- .../design_management/mock_data/no_designs.js | 2 +- .../design_management/mock_data/versions_list.js | 0 .../pages/__snapshots__/index_spec.js.snap | 125 +++++--- .../pages/design/__snapshots__/index_spec.js.snap | 16 +- .../design_management/pages/design/index_spec.js | 9 +- .../design_management/pages/index_apollo_spec.js | 162 ++++++++++ .../frontend/design_management/pages/index_spec.js | 196 +++++++----- spec/frontend/design_management/router_spec.js | 16 +- .../design_management/utils/cache_update_spec.js | 2 +- .../utils/design_management_utils_spec.js | 7 +- .../design_management/utils/error_messages_spec.js | 6 +- 34 files changed, 924 insertions(+), 945 deletions(-) create mode 100644 spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap delete mode 100644 spec/frontend/design_management/components/toolbar/__snapshots__/pagination_button_spec.js.snap delete mode 100644 spec/frontend/design_management/components/toolbar/__snapshots__/pagination_spec.js.snap create mode 100644 spec/frontend/design_management/components/toolbar/design_navigation_spec.js delete mode 100644 spec/frontend/design_management/components/toolbar/pagination_button_spec.js delete mode 100644 spec/frontend/design_management/components/toolbar/pagination_spec.js create mode 100644 spec/frontend/design_management/mock_data/apollo_mock.js create mode 100644 spec/frontend/design_management/mock_data/versions_list.js create mode 100644 spec/frontend/design_management/pages/index_apollo_spec.js (limited to 'spec/frontend/design_management') diff --git a/spec/frontend/design_management/components/__snapshots__/design_note_pin_spec.js.snap b/spec/frontend/design_management/components/__snapshots__/design_note_pin_spec.js.snap index 4c848256e5b..62a0f675cff 100644 --- a/spec/frontend/design_management/components/__snapshots__/design_note_pin_spec.js.snap +++ b/spec/frontend/design_management/components/__snapshots__/design_note_pin_spec.js.snap @@ -3,13 +3,13 @@ exports[`Design note pin component should match the snapshot of note when repositioning 1`] = ` `; @@ -17,7 +17,7 @@ exports[`Design note pin component should match the snapshot of note when reposi exports[`Design note pin component should match the snapshot of note with index 1`] = ` `; diff --git a/spec/frontend/design_management/components/delete_button_spec.js b/spec/frontend/design_management/components/delete_button_spec.js index 9d3bcd98e44..cd4ef1f0ccd 100644 --- a/spec/frontend/design_management/components/delete_button_spec.js +++ b/spec/frontend/design_management/components/delete_button_spec.js @@ -1,11 +1,11 @@ import { shallowMount } from '@vue/test-utils'; -import { GlDeprecatedButton, GlModal, GlModalDirective } from '@gitlab/ui'; +import { GlButton, GlModal, GlModalDirective } from '@gitlab/ui'; import BatchDeleteButton from '~/design_management/components/delete_button.vue'; describe('Batch delete button component', () => { let wrapper; - const findButton = () => wrapper.find(GlDeprecatedButton); + const findButton = () => wrapper.find(GlButton); const findModal = () => wrapper.find(GlModal); function createComponent(isDeleting = false) { diff --git a/spec/frontend/design_management/components/design_notes/design_discussion_spec.js b/spec/frontend/design_management/components/design_notes/design_discussion_spec.js index 102e8e0664c..176c10ea584 100644 --- a/spec/frontend/design_management/components/design_notes/design_discussion_spec.js +++ b/spec/frontend/design_management/components/design_notes/design_discussion_spec.js @@ -61,6 +61,10 @@ describe('Design discussions component', () => { ...data, }; }, + provide: { + projectPath: 'project-path', + issueIid: '1', + }, mocks: { $apollo, $route: { diff --git a/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap b/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap index 9cd427f6aae..d76b6e712fe 100644 --- a/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap +++ b/spec/frontend/design_management/components/list/__snapshots__/item_spec.js.snap @@ -8,328 +8,9 @@ exports[`Design management list item component when item appears in view after i /> `; -exports[`Design management list item component with no notes renders item with correct status icon for creation event 1`] = ` - -
-
- - - -
- - - - - test - -
- -
-
- - test - - - - - Updated - - -
- - -
- -`; - -exports[`Design management list item component with no notes renders item with correct status icon for deletion event 1`] = ` - -
-
- - - -
- - - - - test - -
- -
-
- - test - - - - - Updated - - -
- - -
- -`; - -exports[`Design management list item component with no notes renders item with correct status icon for modification event 1`] = ` - -
-
- - - -
- - - - - test - -
- -
-
- - test - - - - - Updated - - -
- - -
- -`; - -exports[`Design management list item component with no notes renders item with no status icon for none event 1`] = ` - -
- - - - - - test - -
- -
-
- - test - - - - - Updated - - -
- - -
- -`; - -exports[`Design management list item component with no notes renders loading spinner when isUploading is true 1`] = ` - -
- - - - - - - -
- -
-
- - test - - - - - Updated - - -
- - -
- -`; - exports[`Design management list item component with notes renders item with multiple comments 1`] = `
- +
- + { let wrapper; + const findDesignEvent = () => wrapper.find('[data-testid="designEvent"]'); + const findEventIcon = () => findDesignEvent().find(Icon); + const findLoadingIcon = () => wrapper.find(GlLoadingIcon); + function createComponent({ notesCount = 0, event = DESIGN_VERSION_EVENT.NO_CHANGE, @@ -134,35 +139,31 @@ describe('Design management list item component', () => { }); }); - describe('with no notes', () => { - it('renders item with no status icon for none event', () => { - createComponent(); - - expect(wrapper.element).toMatchSnapshot(); - }); - - it('renders item with correct status icon for modification event', () => { - createComponent({ event: DESIGN_VERSION_EVENT.MODIFICATION }); - - expect(wrapper.element).toMatchSnapshot(); - }); - - it('renders item with correct status icon for deletion event', () => { - createComponent({ event: DESIGN_VERSION_EVENT.DELETION }); + it('renders loading spinner when isUploading is true', () => { + createComponent({ isUploading: true }); - expect(wrapper.element).toMatchSnapshot(); - }); + expect(findLoadingIcon().exists()).toBe(true); + }); - it('renders item with correct status icon for creation event', () => { - createComponent({ event: DESIGN_VERSION_EVENT.CREATION }); + it('renders item with no status icon for none event', () => { + createComponent(); - expect(wrapper.element).toMatchSnapshot(); - }); - - it('renders loading spinner when isUploading is true', () => { - createComponent({ isUploading: true }); + expect(findDesignEvent().exists()).toBe(false); + }); - expect(wrapper.element).toMatchSnapshot(); + describe('with associated event', () => { + it.each` + event | icon | className + ${DESIGN_VERSION_EVENT.MODIFICATION} | ${'file-modified-solid'} | ${'text-primary-500'} + ${DESIGN_VERSION_EVENT.DELETION} | ${'file-deletion-solid'} | ${'text-danger-500'} + ${DESIGN_VERSION_EVENT.CREATION} | ${'file-addition-solid'} | ${'text-success-500'} + `('renders item with correct status icon for $event event', ({ event, icon, className }) => { + createComponent({ event }); + const eventIcon = findEventIcon(); + + expect(eventIcon.exists()).toBe(true); + expect(eventIcon.props('name')).toBe(icon); + expect(eventIcon.classes()).toContain(className); }); }); }); diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap new file mode 100644 index 00000000000..a7d6145285c --- /dev/null +++ b/spec/frontend/design_management/components/toolbar/__snapshots__/design_navigation_spec.js.snap @@ -0,0 +1,35 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`Design management pagination component hides components when designs are empty 1`] = ``; + +exports[`Design management pagination component renders navigation buttons 1`] = ` +
+ + 0 of 2 + + + + + + +
+`; diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap index e55cff8de3d..b286a74ebb8 100644 --- a/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap +++ b/spec/frontend/design_management/components/toolbar/__snapshots__/index_spec.js.snap @@ -2,60 +2,60 @@ exports[`Design management toolbar component renders design and updated data 1`] = `
- - - -
-

- test.jpg -

+ + - - Updated 1 hour ago by Test Name - +

+ test.jpg +

+ + + Updated 1 hour ago by Test Name + +
- - - - + icon="download" + size="medium" + variant="default" + /> - - + /> `; diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/pagination_button_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/pagination_button_spec.js.snap deleted file mode 100644 index 08662a04f15..00000000000 --- a/spec/frontend/design_management/components/toolbar/__snapshots__/pagination_button_spec.js.snap +++ /dev/null @@ -1,28 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Design management pagination button component disables button when no design is passed 1`] = ` - - - -`; - -exports[`Design management pagination button component renders router-link 1`] = ` - - - -`; diff --git a/spec/frontend/design_management/components/toolbar/__snapshots__/pagination_spec.js.snap b/spec/frontend/design_management/components/toolbar/__snapshots__/pagination_spec.js.snap deleted file mode 100644 index 0197b4bff79..00000000000 --- a/spec/frontend/design_management/components/toolbar/__snapshots__/pagination_spec.js.snap +++ /dev/null @@ -1,29 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`Design management pagination component hides components when designs are empty 1`] = ``; - -exports[`Design management pagination component renders pagination buttons 1`] = ` -
- - 0 of 2 - -
- - - -
-
-`; diff --git a/spec/frontend/design_management/components/toolbar/design_navigation_spec.js b/spec/frontend/design_management/components/toolbar/design_navigation_spec.js new file mode 100644 index 00000000000..1c6588a9628 --- /dev/null +++ b/spec/frontend/design_management/components/toolbar/design_navigation_spec.js @@ -0,0 +1,79 @@ +/* global Mousetrap */ +import 'mousetrap'; +import { shallowMount } from '@vue/test-utils'; +import DesignNavigation from '~/design_management/components/toolbar/design_navigation.vue'; +import { DESIGN_ROUTE_NAME } from '~/design_management/router/constants'; + +const push = jest.fn(); +const $router = { + push, +}; + +const $route = { + path: '/designs/design-2', + query: {}, +}; + +describe('Design management pagination component', () => { + let wrapper; + + function createComponent() { + wrapper = shallowMount(DesignNavigation, { + propsData: { + id: '2', + }, + mocks: { + $router, + $route, + }, + }); + } + + beforeEach(() => { + createComponent(); + }); + + afterEach(() => { + wrapper.destroy(); + }); + + it('hides components when designs are empty', () => { + expect(wrapper.element).toMatchSnapshot(); + }); + + it('renders navigation buttons', () => { + wrapper.setData({ + designs: [{ id: '1' }, { id: '2' }], + }); + + return wrapper.vm.$nextTick().then(() => { + expect(wrapper.element).toMatchSnapshot(); + }); + }); + + describe('keyboard buttons navigation', () => { + beforeEach(() => { + wrapper.setData({ + designs: [{ filename: '1' }, { filename: '2' }, { filename: '3' }], + }); + }); + + it('routes to previous design on Left button', () => { + Mousetrap.trigger('left'); + expect(push).toHaveBeenCalledWith({ + name: DESIGN_ROUTE_NAME, + params: { id: '1' }, + query: {}, + }); + }); + + it('routes to next design on Right button', () => { + Mousetrap.trigger('right'); + expect(push).toHaveBeenCalledWith({ + name: DESIGN_ROUTE_NAME, + params: { id: '3' }, + query: {}, + }); + }); + }); +}); diff --git a/spec/frontend/design_management/components/toolbar/index_spec.js b/spec/frontend/design_management/components/toolbar/index_spec.js index 2910b2f62ba..2914365b0df 100644 --- a/spec/frontend/design_management/components/toolbar/index_spec.js +++ b/spec/frontend/design_management/components/toolbar/index_spec.js @@ -1,9 +1,9 @@ import { createLocalVue, shallowMount } from '@vue/test-utils'; import VueRouter from 'vue-router'; +import { GlButton } from '@gitlab/ui'; import Toolbar from '~/design_management/components/toolbar/index.vue'; import DeleteButton from '~/design_management/components/delete_button.vue'; import { DESIGNS_ROUTE_NAME } from '~/design_management/router/constants'; -import { GlDeprecatedButton } from '@gitlab/ui'; const localVue = createLocalVue(); localVue.use(VueRouter); @@ -116,7 +116,7 @@ describe('Design management toolbar component', () => { }); it('renders download button with correct link', () => { - expect(wrapper.find(GlDeprecatedButton).attributes('href')).toBe( + expect(wrapper.find(GlButton).attributes('href')).toBe( '/-/designs/306/7f747adcd4693afadbe968d7ba7d983349b9012d', ); }); diff --git a/spec/frontend/design_management/components/toolbar/pagination_button_spec.js b/spec/frontend/design_management/components/toolbar/pagination_button_spec.js deleted file mode 100644 index b7df201795b..00000000000 --- a/spec/frontend/design_management/components/toolbar/pagination_button_spec.js +++ /dev/null @@ -1,61 +0,0 @@ -import { createLocalVue, shallowMount } from '@vue/test-utils'; -import VueRouter from 'vue-router'; -import PaginationButton from '~/design_management/components/toolbar/pagination_button.vue'; -import { DESIGN_ROUTE_NAME } from '~/design_management/router/constants'; - -const localVue = createLocalVue(); -localVue.use(VueRouter); -const router = new VueRouter(); - -describe('Design management pagination button component', () => { - let wrapper; - - function createComponent(design = null) { - wrapper = shallowMount(PaginationButton, { - localVue, - router, - propsData: { - design, - title: 'Test title', - iconName: 'angle-right', - }, - stubs: ['router-link'], - }); - } - - afterEach(() => { - wrapper.destroy(); - }); - - it('disables button when no design is passed', () => { - createComponent(); - - expect(wrapper.element).toMatchSnapshot(); - }); - - it('renders router-link', () => { - createComponent({ id: '2' }); - - expect(wrapper.element).toMatchSnapshot(); - }); - - describe('designLink', () => { - it('returns empty link when design is null', () => { - createComponent(); - - expect(wrapper.vm.designLink).toEqual({}); - }); - - it('returns design link', () => { - createComponent({ id: '2', filename: 'test' }); - - wrapper.vm.$router.replace('/root/test-project/issues/1/designs/test?version=1'); - - expect(wrapper.vm.designLink).toEqual({ - name: DESIGN_ROUTE_NAME, - params: { id: 'test' }, - query: { version: '1' }, - }); - }); - }); -}); diff --git a/spec/frontend/design_management/components/toolbar/pagination_spec.js b/spec/frontend/design_management/components/toolbar/pagination_spec.js deleted file mode 100644 index db5a36dadf6..00000000000 --- a/spec/frontend/design_management/components/toolbar/pagination_spec.js +++ /dev/null @@ -1,79 +0,0 @@ -/* global Mousetrap */ -import 'mousetrap'; -import { shallowMount } from '@vue/test-utils'; -import Pagination from '~/design_management/components/toolbar/pagination.vue'; -import { DESIGN_ROUTE_NAME } from '~/design_management/router/constants'; - -const push = jest.fn(); -const $router = { - push, -}; - -const $route = { - path: '/designs/design-2', - query: {}, -}; - -describe('Design management pagination component', () => { - let wrapper; - - function createComponent() { - wrapper = shallowMount(Pagination, { - propsData: { - id: '2', - }, - mocks: { - $router, - $route, - }, - }); - } - - beforeEach(() => { - createComponent(); - }); - - afterEach(() => { - wrapper.destroy(); - }); - - it('hides components when designs are empty', () => { - expect(wrapper.element).toMatchSnapshot(); - }); - - it('renders pagination buttons', () => { - wrapper.setData({ - designs: [{ id: '1' }, { id: '2' }], - }); - - return wrapper.vm.$nextTick().then(() => { - expect(wrapper.element).toMatchSnapshot(); - }); - }); - - describe('keyboard buttons navigation', () => { - beforeEach(() => { - wrapper.setData({ - designs: [{ filename: '1' }, { filename: '2' }, { filename: '3' }], - }); - }); - - it('routes to previous design on Left button', () => { - Mousetrap.trigger('left'); - expect(push).toHaveBeenCalledWith({ - name: DESIGN_ROUTE_NAME, - params: { id: '1' }, - query: {}, - }); - }); - - it('routes to next design on Right button', () => { - Mousetrap.trigger('right'); - expect(push).toHaveBeenCalledWith({ - name: DESIGN_ROUTE_NAME, - params: { id: '3' }, - query: {}, - }); - }); - }); -}); diff --git a/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap b/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap index 27c0ba589e6..3d7939df28e 100644 --- a/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap +++ b/spec/frontend/design_management/components/upload/__snapshots__/button_spec.js.snap @@ -4,16 +4,18 @@ exports[`Design management upload button component renders inverted upload desig
- Upload designs - + - Upload designs @@ -43,7 +47,7 @@ exports[`Design management upload button component renders loading icon 1`] = ` label="Loading" size="sm" /> - + - Upload designs - +