diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-12-17 14:59:07 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-12-17 14:59:07 +0300 |
commit | 8b573c94895dc0ac0e1d9d59cf3e8745e8b539ca (patch) | |
tree | 544930fb309b30317ae9797a9683768705d664c4 /spec/frontend/registry/explorer/components/list_page/image_list_spec.js | |
parent | 4b1de649d0168371549608993deac953eb692019 (diff) |
Add latest changes from gitlab-org/gitlab@13-7-stable-eev13.7.0-rc42
Diffstat (limited to 'spec/frontend/registry/explorer/components/list_page/image_list_spec.js')
-rw-r--r-- | spec/frontend/registry/explorer/components/list_page/image_list_spec.js | 60 |
1 files changed, 41 insertions, 19 deletions
diff --git a/spec/frontend/registry/explorer/components/list_page/image_list_spec.js b/spec/frontend/registry/explorer/components/list_page/image_list_spec.js index 03ba6ad7f80..54befc9973a 100644 --- a/spec/frontend/registry/explorer/components/list_page/image_list_spec.js +++ b/spec/frontend/registry/explorer/components/list_page/image_list_spec.js @@ -1,29 +1,25 @@ import { shallowMount } from '@vue/test-utils'; -import { GlPagination } from '@gitlab/ui'; +import { GlKeysetPagination } from '@gitlab/ui'; import Component from '~/registry/explorer/components/list_page/image_list.vue'; import ImageListRow from '~/registry/explorer/components/list_page/image_list_row.vue'; -import { imagesListResponse, imagePagination } from '../../mock_data'; +import { imagesListResponse, pageInfo as defaultPageInfo } from '../../mock_data'; describe('Image List', () => { let wrapper; const findRow = () => wrapper.findAll(ImageListRow); - const findPagination = () => wrapper.find(GlPagination); + const findPagination = () => wrapper.find(GlKeysetPagination); - const mountComponent = () => { + const mountComponent = (pageInfo = defaultPageInfo) => { wrapper = shallowMount(Component, { propsData: { - images: imagesListResponse.data, - pagination: imagePagination, + images: imagesListResponse, + pageInfo, }, }); }; - beforeEach(() => { - mountComponent(); - }); - afterEach(() => { wrapper.destroy(); wrapper = null; @@ -31,10 +27,14 @@ describe('Image List', () => { describe('list', () => { it('contains one list element for each image', () => { - expect(findRow().length).toBe(imagesListResponse.data.length); + mountComponent(); + + expect(findRow().length).toBe(imagesListResponse.length); }); it('when delete event is emitted on the row it emits up a delete event', () => { + mountComponent(); + findRow() .at(0) .vm.$emit('delete', 'foo'); @@ -44,19 +44,41 @@ describe('Image List', () => { describe('pagination', () => { it('exists', () => { + mountComponent(); + expect(findPagination().exists()).toBe(true); }); - it('is wired to the correct pagination props', () => { - const pagination = findPagination(); - expect(pagination.props('perPage')).toBe(imagePagination.perPage); - expect(pagination.props('totalItems')).toBe(imagePagination.total); - expect(pagination.props('value')).toBe(imagePagination.page); + it.each` + hasNextPage | hasPreviousPage | isVisible + ${true} | ${true} | ${true} + ${true} | ${false} | ${true} + ${false} | ${true} | ${true} + `( + 'when hasNextPage is $hasNextPage and hasPreviousPage is $hasPreviousPage: is $isVisible that the component is visible', + ({ hasNextPage, hasPreviousPage, isVisible }) => { + mountComponent({ hasNextPage, hasPreviousPage }); + + expect(findPagination().exists()).toBe(isVisible); + expect(findPagination().props('hasPreviousPage')).toBe(hasPreviousPage); + expect(findPagination().props('hasNextPage')).toBe(hasNextPage); + }, + ); + + it('emits "prev-page" when the user clicks the back page button', () => { + mountComponent({ hasPreviousPage: true }); + + findPagination().vm.$emit('prev'); + + expect(wrapper.emitted('prev-page')).toEqual([[]]); }); - it('emits a pageChange event when the page change', () => { - findPagination().vm.$emit(GlPagination.model.event, 2); - expect(wrapper.emitted('pageChange')).toEqual([[2]]); + it('emits "next-page" when the user clicks the forward page button', () => { + mountComponent({ hasNextPage: true }); + + findPagination().vm.$emit('next'); + + expect(wrapper.emitted('next-page')).toEqual([[]]); }); }); }); |