From 1c8fa70f9d0818e2a82089c8643a6e455bca47fd Mon Sep 17 00:00:00 2001 From: GitLab Bot Date: Fri, 28 Feb 2020 18:09:07 +0000 Subject: Add latest changes from gitlab-org/gitlab@master --- .../registry/explorer/pages/details_spec.js | 22 +++++++------- spec/frontend/registry/explorer/pages/list_spec.js | 10 +++---- .../registry/explorer/stores/actions_spec.js | 24 ++++----------- .../registry/explorer/stores/getters_spec.js | 34 ++++++++++++++++++++++ 4 files changed, 55 insertions(+), 35 deletions(-) create mode 100644 spec/frontend/registry/explorer/stores/getters_spec.js (limited to 'spec/frontend/registry/explorer') diff --git a/spec/frontend/registry/explorer/pages/details_spec.js b/spec/frontend/registry/explorer/pages/details_spec.js index 48f3b0f9b65..2b83f7e7351 100644 --- a/spec/frontend/registry/explorer/pages/details_spec.js +++ b/spec/frontend/registry/explorer/pages/details_spec.js @@ -1,5 +1,5 @@ import { mount } from '@vue/test-utils'; -import { GlTable, GlPagination, GlLoadingIcon } from '@gitlab/ui'; +import { GlTable, GlPagination, GlSkeletonLoader } from '@gitlab/ui'; import Tracking from '~/tracking'; import stubChildren from 'helpers/stub_children'; import component from '~/registry/explorer/pages/details.vue'; @@ -14,8 +14,7 @@ describe('Details Page', () => { const findDeleteModal = () => wrapper.find(GlModal); const findPagination = () => wrapper.find(GlPagination); - const findLoadingIcon = () => wrapper.find(GlLoadingIcon); - const findTagsTable = () => wrapper.find(GlTable); + const findSkeletonLoader = () => wrapper.find(GlSkeletonLoader); const findMainCheckbox = () => wrapper.find({ ref: 'mainCheckbox' }); const findFirstRowItem = ref => wrapper.find({ ref }); const findBulkDeleteButton = () => wrapper.find({ ref: 'bulkDeleteButton' }); @@ -33,7 +32,7 @@ describe('Details Page', () => { ...stubChildren(component), GlModal, GlSprintf: false, - GlTable: false, + GlTable, }, mocks: { $route: { @@ -53,18 +52,19 @@ describe('Details Page', () => { }); describe('when isLoading is true', () => { - beforeAll(() => store.commit(SET_MAIN_LOADING, true)); + beforeEach(() => { + store.dispatch('receiveTagsListSuccess', { ...tagsListResponse, data: [] }); + store.commit(SET_MAIN_LOADING, true); + }); afterAll(() => store.commit(SET_MAIN_LOADING, false)); - it('has a loading icon', () => { - expect(findLoadingIcon().exists()).toBe(true); + it('has a skeleton loader', () => { + expect(findSkeletonLoader().exists()).toBe(true); }); - it('does not have a main content', () => { - expect(findTagsTable().exists()).toBe(false); - expect(findPagination().exists()).toBe(false); - expect(findDeleteModal().exists()).toBe(false); + it('does not have list items', () => { + expect(findFirstRowItem('rowCheckbox').exists()).toBe(false); }); }); diff --git a/spec/frontend/registry/explorer/pages/list_spec.js b/spec/frontend/registry/explorer/pages/list_spec.js index f463dc49035..91c3c242ed4 100644 --- a/spec/frontend/registry/explorer/pages/list_spec.js +++ b/spec/frontend/registry/explorer/pages/list_spec.js @@ -1,6 +1,6 @@ import VueRouter from 'vue-router'; import { shallowMount, createLocalVue } from '@vue/test-utils'; -import { GlPagination, GlLoadingIcon, GlSprintf } from '@gitlab/ui'; +import { GlPagination, GlSkeletonLoader, GlSprintf } from '@gitlab/ui'; import Tracking from '~/tracking'; import component from '~/registry/explorer/pages/list.vue'; import store from '~/registry/explorer/stores/'; @@ -17,7 +17,7 @@ describe('List Page', () => { const findDeleteBtn = () => wrapper.find({ ref: 'deleteImageButton' }); const findDeleteModal = () => wrapper.find(GlModal); - const findLoadingIcon = () => wrapper.find(GlLoadingIcon); + const findSkeletonLoader = () => wrapper.find(GlSkeletonLoader); const findImagesList = () => wrapper.find({ ref: 'imagesList' }); const findRowItems = () => wrapper.findAll({ ref: 'rowItem' }); const findEmptyState = () => wrapper.find(GlEmptyState); @@ -71,7 +71,7 @@ describe('List Page', () => { }); it('should not show the loading or default state', () => { - expect(findLoadingIcon().exists()).toBe(false); + expect(findSkeletonLoader().exists()).toBe(false); expect(findImagesList().exists()).toBe(false); }); }); @@ -81,8 +81,8 @@ describe('List Page', () => { afterAll(() => store.commit(SET_MAIN_LOADING, false)); - it('shows the loading icon', () => { - expect(findLoadingIcon().exists()).toBe(true); + it('shows the skeleton loader', () => { + expect(findSkeletonLoader().exists()).toBe(true); }); it('imagesList is not visible', () => { diff --git a/spec/frontend/registry/explorer/stores/actions_spec.js b/spec/frontend/registry/explorer/stores/actions_spec.js index a3fb29c0eb9..3e22621058e 100644 --- a/spec/frontend/registry/explorer/stores/actions_spec.js +++ b/spec/frontend/registry/explorer/stores/actions_spec.js @@ -180,10 +180,7 @@ describe('Actions RegistryExplorer Store', () => { { tagsPagination: {}, }, - [ - { type: types.SET_MAIN_LOADING, payload: true }, - { type: types.SET_MAIN_LOADING, payload: false }, - ], + [{ type: types.SET_MAIN_LOADING, payload: true }], [ { type: 'requestTagsList', @@ -220,13 +217,11 @@ describe('Actions RegistryExplorer Store', () => { }); describe('request delete multiple tags', () => { - const id = 1; - const params = window.btoa(JSON.stringify({ id })); - const projectPath = 'project-path'; - const url = `${projectPath}/registry/repository/${id}/tags/bulk_destroy`; + const url = `project-path/registry/repository/foo/tags`; + const params = window.btoa(JSON.stringify({ tags_path: `${url}?format=json` })); it('successfully performs the delete request', done => { - mock.onDelete(url).replyOnce(200); + mock.onDelete(`${url}/bulk_destroy`).replyOnce(200); testAction( actions.requestDeleteTags, @@ -235,15 +230,9 @@ describe('Actions RegistryExplorer Store', () => { params, }, { - config: { - projectPath, - }, tagsPagination: {}, }, - [ - { type: types.SET_MAIN_LOADING, payload: true }, - { type: types.SET_MAIN_LOADING, payload: false }, - ], + [{ type: types.SET_MAIN_LOADING, payload: true }], [ { type: 'requestTagsList', @@ -267,9 +256,6 @@ describe('Actions RegistryExplorer Store', () => { params, }, { - config: { - projectPath, - }, tagsPagination: {}, }, [ diff --git a/spec/frontend/registry/explorer/stores/getters_spec.js b/spec/frontend/registry/explorer/stores/getters_spec.js new file mode 100644 index 00000000000..c224f076d30 --- /dev/null +++ b/spec/frontend/registry/explorer/stores/getters_spec.js @@ -0,0 +1,34 @@ +import * as getters from '~/registry/explorer/stores/getters'; + +describe('Getters RegistryExplorer store', () => { + let state; + const tags = ['foo', 'bar']; + + describe('tags', () => { + describe('when isLoading is false', () => { + beforeEach(() => { + state = { + tags, + isLoading: false, + }; + }); + + it('returns tags', () => { + expect(getters.tags(state)).toEqual(state.tags); + }); + }); + + describe('when isLoading is true', () => { + beforeEach(() => { + state = { + tags, + isLoading: true, + }; + }); + + it('returns empty array', () => { + expect(getters.tags(state)).toEqual([]); + }); + }); + }); +}); -- cgit v1.2.1