From 7019b646c5a4a588b4018bdb8b8afdfd81a2ae60 Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Tue, 4 Dec 2018 13:20:43 +0000 Subject: Replaces vue-resource with axios for registry code --- .../components/collapsible_container_spec.js | 28 +++++++++++++++++----- 1 file changed, 22 insertions(+), 6 deletions(-) (limited to 'spec/javascripts/registry/components/collapsible_container_spec.js') diff --git a/spec/javascripts/registry/components/collapsible_container_spec.js b/spec/javascripts/registry/components/collapsible_container_spec.js index 256a242f784..069139bc564 100644 --- a/spec/javascripts/registry/components/collapsible_container_spec.js +++ b/spec/javascripts/registry/components/collapsible_container_spec.js @@ -1,14 +1,22 @@ +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 { repoPropsData } from '../mock_data'; +import { repoPropsData, registryServerResponse } from '../mock_data'; describe('collapsible registry container', () => { let vm; - let Component; + let mock; + const Component = Vue.extend(collapsibleComponent); beforeEach(() => { - Component = Vue.extend(collapsibleComponent); + mock = new MockAdapter(axios); + + mock + .onGet(repoPropsData.tagsPath) + .replyOnce(200, registryServerResponse, {}); + vm = new Component({ store, propsData: { @@ -18,6 +26,7 @@ describe('collapsible registry container', () => { }); afterEach(() => { + mock.restore(); vm.$destroy(); }); @@ -29,10 +38,17 @@ describe('collapsible registry container', () => { ); }); - it('should be open when user clicks on closed repo', done => { + fit('should be open when user clicks on closed repo', done => { + + console.log(vm.repo, vm.$el) + vm.$el.querySelector('.js-toggle-repo').click(); + Vue.nextTick(() => { - expect(vm.$el.querySelector('.container-image-tags')).toBeDefined(); + + console.log('nextTick', vm.repo, vm.$el) + + expect(vm.$el.querySelector('.container-image-tags')).not.toBeNull(); expect(vm.$el.querySelector('.container-image-head i').className).toEqual( 'fa fa-chevron-up', ); @@ -58,7 +74,7 @@ describe('collapsible registry container', () => { describe('delete repo', () => { it('should be possible to delete a repo', () => { - expect(vm.$el.querySelector('.js-remove-repo')).toBeDefined(); + expect(vm.$el.querySelector('.js-remove-repo')).not.toBeNull(); }); }); }); -- cgit v1.2.3 From f8bfc2cf7c2f6489e2f70a554a10785859f22765 Mon Sep 17 00:00:00 2001 From: Filipa Lacerda Date: Wed, 5 Dec 2018 09:27:29 +0000 Subject: Reduces technical debt Updates icons to use gitlab-svg Updates buttons to use gitlab-ui Updates broken tests --- .../components/collapsible_container_spec.js | 41 +++++++++------------- 1 file changed, 17 insertions(+), 24 deletions(-) (limited to 'spec/javascripts/registry/components/collapsible_container_spec.js') diff --git a/spec/javascripts/registry/components/collapsible_container_spec.js b/spec/javascripts/registry/components/collapsible_container_spec.js index 069139bc564..a3f7ff76dc7 100644 --- a/spec/javascripts/registry/components/collapsible_container_spec.js +++ b/spec/javascripts/registry/components/collapsible_container_spec.js @@ -3,7 +3,9 @@ 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 { repoPropsData, registryServerResponse } from '../mock_data'; +import * as types from '~/registry/stores/mutation_types'; + +import { repoPropsData, registryServerResponse, reposServerResponse } from '../mock_data'; describe('collapsible registry container', () => { let vm; @@ -13,9 +15,9 @@ describe('collapsible registry container', () => { beforeEach(() => { mock = new MockAdapter(axios); - mock - .onGet(repoPropsData.tagsPath) - .replyOnce(200, registryServerResponse, {}); + mock.onGet(repoPropsData.tagsPath).replyOnce(200, registryServerResponse, {}); + + store.commit(types.SET_REPOS_LIST, reposServerResponse); vm = new Component({ store, @@ -33,25 +35,16 @@ describe('collapsible registry container', () => { describe('toggle', () => { it('should be closed by default', () => { expect(vm.$el.querySelector('.container-image-tags')).toBe(null); - expect(vm.$el.querySelector('.container-image-head i').className).toEqual( - 'fa fa-chevron-right', - ); + expect(vm.iconName).toEqual('angle-right'); }); - fit('should be open when user clicks on closed repo', done => { - - console.log(vm.repo, vm.$el) - + it('should be open when user clicks on closed repo', done => { vm.$el.querySelector('.js-toggle-repo').click(); - + Vue.nextTick(() => { - - console.log('nextTick', vm.repo, vm.$el) - expect(vm.$el.querySelector('.container-image-tags')).not.toBeNull(); - expect(vm.$el.querySelector('.container-image-head i').className).toEqual( - 'fa fa-chevron-up', - ); + expect(vm.iconName).toEqual('angle-up'); + done(); }); }); @@ -61,12 +54,12 @@ describe('collapsible registry container', () => { Vue.nextTick(() => { vm.$el.querySelector('.js-toggle-repo').click(); - Vue.nextTick(() => { - expect(vm.$el.querySelector('.container-image-tags')).toBe(null); - expect(vm.$el.querySelector('.container-image-head i').className).toEqual( - 'fa fa-chevron-right', - ); - done(); + setTimeout(() => { + Vue.nextTick(() => { + expect(vm.$el.querySelector('.container-image-tags')).toBe(null); + expect(vm.iconName).toEqual('angle-right'); + done(); + }); }); }); }); -- cgit v1.2.3