diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-02-18 13:34:06 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-02-18 13:34:06 +0300 |
commit | 859a6fb938bb9ee2a317c46dfa4fcc1af49608f0 (patch) | |
tree | d7f2700abe6b4ffcb2dcfc80631b2d87d0609239 /spec/frontend/import_entities/import_groups/components/import_table_spec.js | |
parent | 446d496a6d000c73a304be52587cd9bbc7493136 (diff) |
Add latest changes from gitlab-org/gitlab@13-9-stable-eev13.9.0-rc42
Diffstat (limited to 'spec/frontend/import_entities/import_groups/components/import_table_spec.js')
-rw-r--r-- | spec/frontend/import_entities/import_groups/components/import_table_spec.js | 167 |
1 files changed, 156 insertions, 11 deletions
diff --git a/spec/frontend/import_entities/import_groups/components/import_table_spec.js b/spec/frontend/import_entities/import_groups/components/import_table_spec.js index cd184bb65cc..dd734782169 100644 --- a/spec/frontend/import_entities/import_groups/components/import_table_spec.js +++ b/spec/frontend/import_entities/import_groups/components/import_table_spec.js @@ -1,15 +1,15 @@ +import { GlEmptyState, GlLoadingIcon, GlSearchBoxByClick, GlSprintf } from '@gitlab/ui'; import { shallowMount, createLocalVue } from '@vue/test-utils'; import VueApollo from 'vue-apollo'; -import { GlLoadingIcon } from '@gitlab/ui'; -import waitForPromises from 'helpers/wait_for_promises'; import createMockApollo from 'helpers/mock_apollo_helper'; -import ImportTableRow from '~/import_entities/import_groups/components/import_table_row.vue'; +import waitForPromises from 'helpers/wait_for_promises'; +import { STATUSES } from '~/import_entities/constants'; import ImportTable from '~/import_entities/import_groups/components/import_table.vue'; -import setTargetNamespaceMutation from '~/import_entities/import_groups/graphql/mutations/set_target_namespace.mutation.graphql'; -import setNewNameMutation from '~/import_entities/import_groups/graphql/mutations/set_new_name.mutation.graphql'; +import ImportTableRow from '~/import_entities/import_groups/components/import_table_row.vue'; import importGroupMutation from '~/import_entities/import_groups/graphql/mutations/import_group.mutation.graphql'; - -import { STATUSES } from '~/import_entities/constants'; +import setNewNameMutation from '~/import_entities/import_groups/graphql/mutations/set_new_name.mutation.graphql'; +import setTargetNamespaceMutation from '~/import_entities/import_groups/graphql/mutations/set_target_namespace.mutation.graphql'; +import PaginationLinks from '~/vue_shared/components/pagination_links.vue'; import { availableNamespacesFixture, generateFakeEntry } from '../graphql/fixtures'; @@ -20,6 +20,9 @@ describe('import table', () => { let wrapper; let apolloProvider; + const FAKE_GROUP = generateFakeEntry({ id: 1, status: STATUSES.NONE }); + const FAKE_PAGE_INFO = { page: 1, perPage: 20, total: 40, totalPages: 2 }; + const createComponent = ({ bulkImportSourceGroups }) => { apolloProvider = createMockApollo([], { Query: { @@ -34,6 +37,12 @@ describe('import table', () => { }); wrapper = shallowMount(ImportTable, { + propsData: { + sourceUrl: 'https://demo.host', + }, + stubs: { + GlSprintf, + }, localVue, apolloProvider, }); @@ -62,25 +71,50 @@ describe('import table', () => { expect(wrapper.find(GlLoadingIcon).exists()).toBe(false); }); + it('renders message about empty state when no groups are available for import', async () => { + createComponent({ + bulkImportSourceGroups: () => ({ + nodes: [], + pageInfo: FAKE_PAGE_INFO, + }), + }); + await waitForPromises(); + + expect(wrapper.find(GlEmptyState).props().title).toBe('No groups available for import'); + }); + it('renders import row for each group in response', async () => { const FAKE_GROUPS = [ generateFakeEntry({ id: 1, status: STATUSES.NONE }), generateFakeEntry({ id: 2, status: STATUSES.FINISHED }), ]; createComponent({ - bulkImportSourceGroups: () => FAKE_GROUPS, + bulkImportSourceGroups: () => ({ + nodes: FAKE_GROUPS, + pageInfo: FAKE_PAGE_INFO, + }), }); await waitForPromises(); expect(wrapper.findAll(ImportTableRow)).toHaveLength(FAKE_GROUPS.length); }); - describe('converts row events to mutation invocations', () => { - const FAKE_GROUP = generateFakeEntry({ id: 1, status: STATUSES.NONE }); + it('does not render status string when result list is empty', async () => { + createComponent({ + bulkImportSourceGroups: jest.fn().mockResolvedValue({ + nodes: [], + pageInfo: FAKE_PAGE_INFO, + }), + }); + await waitForPromises(); + + expect(wrapper.text()).not.toContain('Showing 1-0'); + }); + describe('converts row events to mutation invocations', () => { beforeEach(() => { createComponent({ - bulkImportSourceGroups: () => [FAKE_GROUP], + bulkImportSourceGroups: () => ({ nodes: [FAKE_GROUP], pageInfo: FAKE_PAGE_INFO }), }); return waitForPromises(); }); @@ -100,4 +134,115 @@ describe('import table', () => { }); }); }); + + describe('pagination', () => { + const bulkImportSourceGroupsQueryMock = jest + .fn() + .mockResolvedValue({ nodes: [FAKE_GROUP], pageInfo: FAKE_PAGE_INFO }); + + beforeEach(() => { + createComponent({ + bulkImportSourceGroups: bulkImportSourceGroupsQueryMock, + }); + return waitForPromises(); + }); + + it('correctly passes pagination info from query', () => { + expect(wrapper.find(PaginationLinks).props().pageInfo).toStrictEqual(FAKE_PAGE_INFO); + }); + + it('updates page when page change is requested', async () => { + const REQUESTED_PAGE = 2; + wrapper.find(PaginationLinks).props().change(REQUESTED_PAGE); + + await waitForPromises(); + expect(bulkImportSourceGroupsQueryMock).toHaveBeenCalledWith( + expect.anything(), + expect.objectContaining({ page: REQUESTED_PAGE }), + expect.anything(), + expect.anything(), + ); + }); + + it('updates status text when page is changed', async () => { + const REQUESTED_PAGE = 2; + bulkImportSourceGroupsQueryMock.mockResolvedValue({ + nodes: [FAKE_GROUP], + pageInfo: { + page: 2, + total: 38, + perPage: 20, + totalPages: 2, + }, + }); + wrapper.find(PaginationLinks).props().change(REQUESTED_PAGE); + await waitForPromises(); + + expect(wrapper.text()).toContain('Showing 21-21 of 38'); + }); + }); + + describe('filters', () => { + const bulkImportSourceGroupsQueryMock = jest + .fn() + .mockResolvedValue({ nodes: [FAKE_GROUP], pageInfo: FAKE_PAGE_INFO }); + + beforeEach(() => { + createComponent({ + bulkImportSourceGroups: bulkImportSourceGroupsQueryMock, + }); + return waitForPromises(); + }); + + const findFilterInput = () => wrapper.find(GlSearchBoxByClick); + + it('properly passes filter to graphql query when search box is submitted', async () => { + createComponent({ + bulkImportSourceGroups: bulkImportSourceGroupsQueryMock, + }); + await waitForPromises(); + + const FILTER_VALUE = 'foo'; + findFilterInput().vm.$emit('submit', FILTER_VALUE); + await waitForPromises(); + + expect(bulkImportSourceGroupsQueryMock).toHaveBeenCalledWith( + expect.anything(), + expect.objectContaining({ filter: FILTER_VALUE }), + expect.anything(), + expect.anything(), + ); + }); + + it('updates status string when search box is submitted', async () => { + createComponent({ + bulkImportSourceGroups: bulkImportSourceGroupsQueryMock, + }); + await waitForPromises(); + + const FILTER_VALUE = 'foo'; + findFilterInput().vm.$emit('submit', FILTER_VALUE); + await waitForPromises(); + + expect(wrapper.text()).toContain('Showing 1-1 of 40 groups matching filter "foo"'); + }); + + it('properly resets filter in graphql query when search box is cleared', async () => { + const FILTER_VALUE = 'foo'; + findFilterInput().vm.$emit('submit', FILTER_VALUE); + await waitForPromises(); + + bulkImportSourceGroupsQueryMock.mockClear(); + await apolloProvider.defaultClient.resetStore(); + findFilterInput().vm.$emit('clear'); + await waitForPromises(); + + expect(bulkImportSourceGroupsQueryMock).toHaveBeenCalledWith( + expect.anything(), + expect.objectContaining({ filter: '' }), + expect.anything(), + expect.anything(), + ); + }); + }); }); |