diff options
Diffstat (limited to 'spec/javascripts/registry')
-rw-r--r-- | spec/javascripts/registry/components/app_spec.js | 129 | ||||
-rw-r--r-- | spec/javascripts/registry/components/collapsible_container_spec.js | 87 | ||||
-rw-r--r-- | spec/javascripts/registry/components/table_registry_spec.js | 189 | ||||
-rw-r--r-- | spec/javascripts/registry/mock_data.js | 134 | ||||
-rw-r--r-- | spec/javascripts/registry/stores/actions_spec.js | 132 | ||||
-rw-r--r-- | spec/javascripts/registry/stores/mutations_spec.js | 85 |
6 files changed, 0 insertions, 756 deletions
diff --git a/spec/javascripts/registry/components/app_spec.js b/spec/javascripts/registry/components/app_spec.js deleted file mode 100644 index 5ea3f85a247..00000000000 --- a/spec/javascripts/registry/components/app_spec.js +++ /dev/null @@ -1,129 +0,0 @@ -import MockAdapter from 'axios-mock-adapter'; -import axios from '~/lib/utils/axios_utils'; -import Vue from 'vue'; -import registry from '~/registry/components/app.vue'; -import mountComponent from 'spec/helpers/vue_mount_component_helper'; -import { TEST_HOST } from 'spec/test_constants'; -import { reposServerResponse } from '../mock_data'; - -describe('Registry List', () => { - const Component = Vue.extend(registry); - const props = { - endpoint: `${TEST_HOST}/foo`, - helpPagePath: 'foo', - noContainersImage: 'foo', - containersErrorImage: 'foo', - repositoryUrl: 'foo', - }; - let vm; - let mock; - - beforeEach(() => { - mock = new MockAdapter(axios); - }); - - afterEach(() => { - mock.restore(); - vm.$destroy(); - }); - - describe('with data', () => { - beforeEach(() => { - mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, reposServerResponse); - - vm = mountComponent(Component, { ...props }); - }); - - it('should render a list of repos', done => { - setTimeout(() => { - expect(vm.$store.state.repos.length).toEqual(reposServerResponse.length); - - Vue.nextTick(() => { - expect(vm.$el.querySelectorAll('.container-image').length).toEqual( - reposServerResponse.length, - ); - done(); - }); - }, 0); - }); - - describe('delete repository', () => { - it('should be possible to delete a repo', done => { - setTimeout(() => { - Vue.nextTick(() => { - expect(vm.$el.querySelector('.container-image-head .js-remove-repo')).toBeDefined(); - done(); - }); - }, 0); - }); - }); - - describe('toggle repository', () => { - it('should open the container', done => { - setTimeout(() => { - Vue.nextTick(() => { - vm.$el.querySelector('.js-toggle-repo').click(); - Vue.nextTick(() => { - expect( - vm.$el.querySelector('.js-toggle-repo use').getAttribute('xlink:href'), - ).toContain('angle-up'); - done(); - }); - }); - }, 0); - }); - }); - }); - - describe('without data', () => { - beforeEach(() => { - mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, []); - - vm = mountComponent(Component, { ...props }); - }); - - it('should render empty message', done => { - setTimeout(() => { - expect(vm.$el.querySelector('.js-no-container-images-text').textContent).toEqual( - 'With the Container Registry, every project can have its own space to store its Docker images. More Information', - ); - done(); - }, 0); - }); - }); - - describe('while loading data', () => { - beforeEach(() => { - mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, []); - - vm = mountComponent(Component, { ...props }); - }); - - it('should render a loading spinner', done => { - Vue.nextTick(() => { - expect(vm.$el.querySelector('.gl-spinner')).not.toBe(null); - done(); - }); - }); - }); - - describe('invalid characters in path', () => { - beforeEach(() => { - mock.onGet(`${TEST_HOST}/foo`).replyOnce(200, []); - - vm = mountComponent(Component, { - ...props, - characterError: true, - }); - }); - - it('should render invalid characters error message', done => { - setTimeout(() => { - expect(vm.$el.querySelector('p')).not.toContain( - 'We are having trouble connecting to Docker, which could be due to an issue with your project name or path. More information', - ); - done(); - }); - }); - }); -}); diff --git a/spec/javascripts/registry/components/collapsible_container_spec.js b/spec/javascripts/registry/components/collapsible_container_spec.js deleted file mode 100644 index 2a5d8dd11da..00000000000 --- a/spec/javascripts/registry/components/collapsible_container_spec.js +++ /dev/null @@ -1,87 +0,0 @@ -import MockAdapter from 'axios-mock-adapter'; -import axios from '~/lib/utils/axios_utils'; -import Vue from 'vue'; -import collapsibleComponent from '~/registry/components/collapsible_container.vue'; -import store from '~/registry/stores'; -import * as types from '~/registry/stores/mutation_types'; - -import { repoPropsData, registryServerResponse, reposServerResponse } from '../mock_data'; - -describe('collapsible registry container', () => { - let vm; - let mock; - const Component = Vue.extend(collapsibleComponent); - - const findDeleteBtn = () => vm.$el.querySelector('.js-remove-repo'); - - beforeEach(() => { - mock = new MockAdapter(axios); - - mock.onGet(repoPropsData.tagsPath).replyOnce(200, registryServerResponse, {}); - - store.commit(types.SET_REPOS_LIST, reposServerResponse); - - vm = new Component({ - store, - propsData: { - repo: repoPropsData, - }, - }).$mount(); - }); - - afterEach(() => { - mock.restore(); - vm.$destroy(); - }); - - describe('toggle', () => { - it('should be closed by default', () => { - expect(vm.$el.querySelector('.container-image-tags')).toBe(null); - expect(vm.iconName).toEqual('angle-right'); - }); - - it('should be open when user clicks on closed repo', done => { - vm.$el.querySelector('.js-toggle-repo').click(); - - Vue.nextTick(() => { - expect(vm.$el.querySelector('.container-image-tags')).not.toBeNull(); - expect(vm.iconName).toEqual('angle-up'); - - done(); - }); - }); - - it('should be closed when the user clicks on an opened repo', done => { - vm.$el.querySelector('.js-toggle-repo').click(); - - Vue.nextTick(() => { - vm.$el.querySelector('.js-toggle-repo').click(); - setTimeout(() => { - Vue.nextTick(() => { - expect(vm.$el.querySelector('.container-image-tags')).toBe(null); - expect(vm.iconName).toEqual('angle-right'); - done(); - }); - }); - }); - }); - }); - - describe('delete repo', () => { - it('should be possible to delete a repo', () => { - expect(findDeleteBtn()).not.toBeNull(); - }); - - it('should call deleteItem when confirming deletion', done => { - findDeleteBtn().click(); - spyOn(vm, 'deleteItem').and.returnValue(Promise.resolve()); - - Vue.nextTick(() => { - document.querySelector(`#${vm.modalId} .btn-danger`).click(); - - expect(vm.deleteItem).toHaveBeenCalledWith(vm.repo); - done(); - }); - }); - }); -}); diff --git a/spec/javascripts/registry/components/table_registry_spec.js b/spec/javascripts/registry/components/table_registry_spec.js deleted file mode 100644 index 9c7439206ef..00000000000 --- a/spec/javascripts/registry/components/table_registry_spec.js +++ /dev/null @@ -1,189 +0,0 @@ -import Vue from 'vue'; -import tableRegistry from '~/registry/components/table_registry.vue'; -import store from '~/registry/stores'; -import { mountComponentWithStore } from 'spec/helpers/vue_mount_component_helper'; -import { repoPropsData } from '../mock_data'; - -const [firstImage, secondImage] = repoPropsData.list; - -describe('table registry', () => { - let vm; - const Component = Vue.extend(tableRegistry); - const bulkDeletePath = 'path'; - - const findDeleteBtn = () => vm.$el.querySelector('.js-delete-registry'); - const findDeleteBtnRow = () => vm.$el.querySelector('.js-delete-registry-row'); - const findSelectAllCheckbox = () => vm.$el.querySelector('.js-select-all-checkbox > input'); - const findAllRowCheckboxes = () => - Array.from(vm.$el.querySelectorAll('.js-select-checkbox input')); - const confirmationModal = (child = '') => document.querySelector(`#${vm.modalId} ${child}`); - - const createComponent = () => { - vm = mountComponentWithStore(Component, { - store, - props: { - repo: repoPropsData, - }, - }); - }; - - const selectAllCheckboxes = () => vm.selectAll(); - const deselectAllCheckboxes = () => vm.deselectAll(); - - beforeEach(() => { - createComponent(); - }); - - afterEach(() => { - vm.$destroy(); - }); - - describe('rendering', () => { - it('should render a table with the registry list', () => { - expect(vm.$el.querySelectorAll('table tbody tr').length).toEqual(repoPropsData.list.length); - }); - - it('should render registry tag', () => { - const textRendered = vm.$el - .querySelector('.table tbody tr') - .textContent.trim() - // replace additional whitespace characters (e.g. new lines) with a single empty space - .replace(/\s\s+/g, ' '); - - expect(textRendered).toContain(repoPropsData.list[0].tag); - expect(textRendered).toContain(repoPropsData.list[0].shortRevision); - expect(textRendered).toContain(repoPropsData.list[0].layers); - expect(textRendered).toContain(repoPropsData.list[0].size); - }); - }); - - describe('multi select', () => { - it('should support multiselect and selecting a row should enable delete button', done => { - findSelectAllCheckbox().click(); - selectAllCheckboxes(); - - expect(findSelectAllCheckbox().checked).toBe(true); - - Vue.nextTick(() => { - expect(findDeleteBtn().disabled).toBe(false); - done(); - }); - }); - - it('selecting all checkbox should select all rows and enable delete button', done => { - selectAllCheckboxes(); - - Vue.nextTick(() => { - const checkedValues = findAllRowCheckboxes().filter(x => x.checked); - - expect(checkedValues.length).toBe(repoPropsData.list.length); - done(); - }); - }); - - it('deselecting select all checkbox should deselect all rows and disable delete button', done => { - selectAllCheckboxes(); - deselectAllCheckboxes(); - - Vue.nextTick(() => { - const checkedValues = findAllRowCheckboxes().filter(x => x.checked); - - expect(checkedValues.length).toBe(0); - done(); - }); - }); - - it('should delete multiple items when multiple items are selected', done => { - selectAllCheckboxes(); - - Vue.nextTick(() => { - expect(vm.itemsToBeDeleted).toEqual([0, 1]); - expect(findDeleteBtn().disabled).toBe(false); - - findDeleteBtn().click(); - spyOn(vm, 'multiDeleteItems').and.returnValue(Promise.resolve()); - - Vue.nextTick(() => { - const modal = confirmationModal(); - confirmationModal('.btn-danger').click(); - - expect(modal).toExist(); - - Vue.nextTick(() => { - expect(vm.itemsToBeDeleted).toEqual([]); - expect(vm.multiDeleteItems).toHaveBeenCalledWith({ - path: bulkDeletePath, - items: [firstImage.tag, secondImage.tag], - }); - done(); - }); - }); - }); - }); - }); - - describe('delete registry', () => { - beforeEach(() => { - vm.itemsToBeDeleted = [0]; - }); - - it('should be possible to delete a registry', done => { - Vue.nextTick(() => { - expect(vm.itemsToBeDeleted).toEqual([0]); - expect(findDeleteBtn()).toBeDefined(); - expect(findDeleteBtn().disabled).toBe(false); - expect(findDeleteBtnRow()).toBeDefined(); - done(); - }); - }); - - it('should call deleteItems and reset itemsToBeDeleted when confirming deletion', done => { - Vue.nextTick(() => { - expect(vm.itemsToBeDeleted).toEqual([0]); - expect(findDeleteBtn().disabled).toBe(false); - findDeleteBtn().click(); - spyOn(vm, 'multiDeleteItems').and.returnValue(Promise.resolve()); - - Vue.nextTick(() => { - confirmationModal('.btn-danger').click(); - - expect(vm.itemsToBeDeleted).toEqual([]); - expect(vm.multiDeleteItems).toHaveBeenCalledWith({ - path: bulkDeletePath, - items: [firstImage.tag], - }); - done(); - }); - }); - }); - }); - - describe('pagination', () => { - it('should be possible to change the page', () => { - expect(vm.$el.querySelector('.gl-pagination')).toBeDefined(); - }); - }); - - describe('modal content', () => { - it('should show the singular title and image name when deleting a single image', done => { - findDeleteBtnRow().click(); - - Vue.nextTick(() => { - expect(vm.modalTitle).toBe('Remove image'); - expect(vm.modalDescription).toContain(firstImage.tag); - done(); - }); - }); - - it('should show the plural title and image count when deleting more than one image', done => { - selectAllCheckboxes(); - vm.setModalDescription(); - - Vue.nextTick(() => { - expect(vm.modalTitle).toBe('Remove images'); - expect(vm.modalDescription).toContain('<b>2</b> images'); - done(); - }); - }); - }); -}); diff --git a/spec/javascripts/registry/mock_data.js b/spec/javascripts/registry/mock_data.js deleted file mode 100644 index 130ab298e89..00000000000 --- a/spec/javascripts/registry/mock_data.js +++ /dev/null @@ -1,134 +0,0 @@ -export const defaultState = { - isLoading: false, - endpoint: '', - repos: [], -}; - -export const reposServerResponse = [ - { - destroy_path: 'path', - id: '123', - location: 'location', - path: 'foo', - tags_path: 'tags_path', - }, - { - destroy_path: 'path_', - id: '456', - location: 'location_', - path: 'bar', - tags_path: 'tags_path_', - }, -]; - -export const registryServerResponse = [ - { - name: 'centos7', - short_revision: 'b118ab5b0', - revision: 'b118ab5b0e90b7cb5127db31d5321ac14961d097516a8e0e72084b6cdc783b43', - total_size: 679, - layers: 19, - location: 'location', - created_at: 1505828744434, - destroy_path: 'path_', - }, - { - name: 'centos6', - short_revision: 'b118ab5b0', - revision: 'b118ab5b0e90b7cb5127db31d5321ac14961d097516a8e0e72084b6cdc783b43', - total_size: 679, - layers: 19, - location: 'location', - created_at: 1505828744434, - }, -]; - -export const parsedReposServerResponse = [ - { - canDelete: true, - destroyPath: reposServerResponse[0].destroy_path, - id: reposServerResponse[0].id, - isLoading: false, - list: [], - location: reposServerResponse[0].location, - name: reposServerResponse[0].path, - tagsPath: reposServerResponse[0].tags_path, - }, - { - canDelete: true, - destroyPath: reposServerResponse[1].destroy_path, - id: reposServerResponse[1].id, - isLoading: false, - list: [], - location: reposServerResponse[1].location, - name: reposServerResponse[1].path, - tagsPath: reposServerResponse[1].tags_path, - }, -]; - -export const parsedRegistryServerResponse = [ - { - tag: registryServerResponse[0].name, - revision: registryServerResponse[0].revision, - shortRevision: registryServerResponse[0].short_revision, - size: registryServerResponse[0].total_size, - layers: registryServerResponse[0].layers, - location: registryServerResponse[0].location, - createdAt: registryServerResponse[0].created_at, - destroyPath: registryServerResponse[0].destroy_path, - canDelete: true, - }, - { - tag: registryServerResponse[1].name, - revision: registryServerResponse[1].revision, - shortRevision: registryServerResponse[1].short_revision, - size: registryServerResponse[1].total_size, - layers: registryServerResponse[1].layers, - location: registryServerResponse[1].location, - createdAt: registryServerResponse[1].created_at, - destroyPath: registryServerResponse[1].destroy_path, - canDelete: false, - }, -]; - -export const repoPropsData = { - canDelete: true, - destroyPath: 'path', - id: '123', - isLoading: false, - list: [ - { - tag: 'centos6', - revision: 'b118ab5b0e90b7cb5127db31d5321ac14961d097516a8e0e72084b6cdc783b43', - shortRevision: 'b118ab5b0', - size: 19, - layers: 10, - location: 'location', - createdAt: 1505828744434, - destroyPath: 'path', - canDelete: true, - }, - { - tag: 'test-image', - revision: 'b969de599faea2b3d9b6605a8b0897261c571acaa36db1bdc7349b5775b4e0b4', - shortRevision: 'b969de599', - size: 19, - layers: 10, - location: 'location-2', - createdAt: 1505828744434, - destroyPath: 'path-2', - canDelete: true, - }, - ], - location: 'location', - name: 'foo', - tagsPath: 'path', - pagination: { - perPage: 5, - page: 1, - total: 13, - totalPages: 1, - nextPage: null, - previousPage: null, - }, -}; diff --git a/spec/javascripts/registry/stores/actions_spec.js b/spec/javascripts/registry/stores/actions_spec.js deleted file mode 100644 index 0613ec8e0f1..00000000000 --- a/spec/javascripts/registry/stores/actions_spec.js +++ /dev/null @@ -1,132 +0,0 @@ -import MockAdapter from 'axios-mock-adapter'; -import axios from '~/lib/utils/axios_utils'; -import * as actions from '~/registry/stores/actions'; -import * as types from '~/registry/stores/mutation_types'; -import state from '~/registry/stores/state'; -import { TEST_HOST } from 'spec/test_constants'; -import testAction from '../../helpers/vuex_action_helper'; -import { - reposServerResponse, - registryServerResponse, - parsedReposServerResponse, -} from '../mock_data'; - -describe('Actions Registry Store', () => { - let mockedState; - let mock; - - beforeEach(() => { - mockedState = state(); - mockedState.endpoint = `${TEST_HOST}/endpoint.json`; - mock = new MockAdapter(axios); - }); - - afterEach(() => { - mock.restore(); - }); - - describe('server requests', () => { - describe('fetchRepos', () => { - beforeEach(() => { - mock.onGet(`${TEST_HOST}/endpoint.json`).replyOnce(200, reposServerResponse, {}); - }); - - it('should set receveived repos', done => { - testAction( - actions.fetchRepos, - null, - mockedState, - [ - { type: types.TOGGLE_MAIN_LOADING }, - { type: types.TOGGLE_MAIN_LOADING }, - { type: types.SET_REPOS_LIST, payload: reposServerResponse }, - ], - [], - done, - ); - }); - }); - - describe('fetchList', () => { - let repo; - beforeEach(() => { - mockedState.repos = parsedReposServerResponse; - [, repo] = mockedState.repos; - - mock.onGet(repo.tagsPath).replyOnce(200, registryServerResponse, {}); - }); - - it('should set received list', done => { - testAction( - actions.fetchList, - { repo }, - mockedState, - [ - { type: types.TOGGLE_REGISTRY_LIST_LOADING, payload: repo }, - { type: types.TOGGLE_REGISTRY_LIST_LOADING, payload: repo }, - { - type: types.SET_REGISTRY_LIST, - payload: { - repo, - resp: registryServerResponse, - headers: jasmine.anything(), - }, - }, - ], - [], - done, - ); - }); - }); - }); - - describe('setMainEndpoint', () => { - it('should commit set main endpoint', done => { - testAction( - actions.setMainEndpoint, - 'endpoint', - mockedState, - [{ type: types.SET_MAIN_ENDPOINT, payload: 'endpoint' }], - [], - done, - ); - }); - }); - - describe('toggleLoading', () => { - it('should commit toggle main loading', done => { - testAction( - actions.toggleLoading, - null, - mockedState, - [{ type: types.TOGGLE_MAIN_LOADING }], - [], - done, - ); - }); - }); - - describe('deleteItem', () => { - it('should perform DELETE request on destroyPath', done => { - const destroyPath = `${TEST_HOST}/mygroup/myproject/container_registry/1.json`; - let deleted = false; - mock.onDelete(destroyPath).replyOnce(() => { - deleted = true; - return [200]; - }); - testAction( - actions.deleteItem, - { - destroyPath, - }, - mockedState, - ) - .then(() => { - expect(mock.history.delete.length).toBe(1); - expect(deleted).toBe(true); - done(); - }) - .catch(done.fail); - }); - }); -}); diff --git a/spec/javascripts/registry/stores/mutations_spec.js b/spec/javascripts/registry/stores/mutations_spec.js deleted file mode 100644 index e19fe7a27cf..00000000000 --- a/spec/javascripts/registry/stores/mutations_spec.js +++ /dev/null @@ -1,85 +0,0 @@ -import mutations from '~/registry/stores/mutations'; -import * as types from '~/registry/stores/mutation_types'; -import { - defaultState, - reposServerResponse, - registryServerResponse, - parsedReposServerResponse, - parsedRegistryServerResponse, -} from '../mock_data'; - -describe('Mutations Registry Store', () => { - let mockState; - beforeEach(() => { - mockState = defaultState; - }); - - describe('SET_MAIN_ENDPOINT', () => { - it('should set the main endpoint', () => { - const expectedState = Object.assign({}, mockState, { endpoint: 'foo' }); - mutations[types.SET_MAIN_ENDPOINT](mockState, 'foo'); - - expect(mockState).toEqual(expectedState); - }); - }); - - describe('SET_REPOS_LIST', () => { - it('should set a parsed repository list', () => { - mutations[types.SET_REPOS_LIST](mockState, reposServerResponse); - - expect(mockState.repos).toEqual(parsedReposServerResponse); - }); - }); - - describe('TOGGLE_MAIN_LOADING', () => { - it('should set a parsed repository list', () => { - mutations[types.TOGGLE_MAIN_LOADING](mockState); - - expect(mockState.isLoading).toEqual(true); - }); - }); - - describe('SET_REGISTRY_LIST', () => { - it('should set a list of registries in a specific repository', () => { - mutations[types.SET_REPOS_LIST](mockState, reposServerResponse); - mutations[types.SET_REGISTRY_LIST](mockState, { - repo: mockState.repos[0], - resp: registryServerResponse, - headers: { - 'x-per-page': 2, - 'x-page': 1, - 'x-total': 10, - }, - }); - - expect(mockState.repos[0].list).toEqual(parsedRegistryServerResponse); - expect(mockState.repos[0].pagination).toEqual({ - perPage: 2, - page: 1, - total: 10, - totalPages: NaN, - nextPage: NaN, - previousPage: NaN, - }); - }); - }); - - describe('TOGGLE_REGISTRY_LIST_LOADING', () => { - it('should toggle isLoading property for a specific repository', () => { - mutations[types.SET_REPOS_LIST](mockState, reposServerResponse); - mutations[types.SET_REGISTRY_LIST](mockState, { - repo: mockState.repos[0], - resp: registryServerResponse, - headers: { - 'x-per-page': 2, - 'x-page': 1, - 'x-total': 10, - }, - }); - - mutations[types.TOGGLE_REGISTRY_LIST_LOADING](mockState, mockState.repos[0]); - - expect(mockState.repos[0].isLoading).toEqual(true); - }); - }); -}); |