diff options
Diffstat (limited to 'spec/javascripts/pipelines/pipelines_spec.js')
-rw-r--r-- | spec/javascripts/pipelines/pipelines_spec.js | 219 |
1 files changed, 130 insertions, 89 deletions
diff --git a/spec/javascripts/pipelines/pipelines_spec.js b/spec/javascripts/pipelines/pipelines_spec.js index 7e242eb45e1..ff17602da2b 100644 --- a/spec/javascripts/pipelines/pipelines_spec.js +++ b/spec/javascripts/pipelines/pipelines_spec.js @@ -1,8 +1,10 @@ -import _ from 'underscore'; import Vue from 'vue'; +import MockAdapter from 'axios-mock-adapter'; +import axios from '~/lib/utils/axios_utils'; import pipelinesComp from '~/pipelines/components/pipelines.vue'; import Store from '~/pipelines/stores/pipelines_store'; import mountComponent from 'spec/helpers/vue_mount_component_helper'; +import { pipelineWithStages, stageReply } from './mock_data'; describe('Pipelines', () => { const jsonFixtureName = 'pipelines/pipelines.json'; @@ -12,6 +14,8 @@ describe('Pipelines', () => { let PipelinesComponent; let pipelines; let vm; + let mock; + const paths = { endpoint: 'twitter/flight/pipelines.json', autoDevopsPath: '/help/topics/autodevops/index.md', @@ -34,6 +38,8 @@ describe('Pipelines', () => { }; beforeEach(() => { + mock = new MockAdapter(axios); + pipelines = getJSONFixture(jsonFixtureName); PipelinesComponent = Vue.extend(pipelinesComp); @@ -41,38 +47,14 @@ describe('Pipelines', () => { afterEach(() => { vm.$destroy(); + mock.restore(); }); - const pipelinesInterceptor = (request, next) => { - next(request.respondWith(JSON.stringify(pipelines), { - status: 200, - })); - }; - - const emptyStateInterceptor = (request, next) => { - next(request.respondWith(JSON.stringify({ - pipelines: [], - count: { - all: 0, - pending: 0, - running: 0, - finished: 0, - }, - }), { - status: 200, - })); - }; - - const errorInterceptor = (request, next) => { - next(request.respondWith(JSON.stringify({}), { - status: 500, - })); - }; - describe('With permission', () => { describe('With pipelines in main tab', () => { beforeEach((done) => { - Vue.http.interceptors.push(pipelinesInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, pipelines); + vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: true, @@ -85,12 +67,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, pipelinesInterceptor, - ); - }); - it('renders tabs', () => { expect(vm.$el.querySelector('.js-pipelines-tab-all').textContent.trim()).toContain('All'); }); @@ -116,7 +92,15 @@ describe('Pipelines', () => { describe('Without pipelines on main tab with CI', () => { beforeEach((done) => { - Vue.http.interceptors.push(emptyStateInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, { + pipelines: [], + count: { + all: 0, + pending: 0, + running: 0, + finished: 0, + }, + }); vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: true, @@ -129,12 +113,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, emptyStateInterceptor, - ); - }); - it('renders tabs', () => { expect(vm.$el.querySelector('.js-pipelines-tab-all').textContent.trim()).toContain('All'); }); @@ -158,7 +136,15 @@ describe('Pipelines', () => { describe('Without pipelines nor CI', () => { beforeEach((done) => { - Vue.http.interceptors.push(emptyStateInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, { + pipelines: [], + count: { + all: 0, + pending: 0, + running: 0, + finished: 0, + }, + }); vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: false, @@ -171,12 +157,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, emptyStateInterceptor, - ); - }); - it('renders empty state', () => { expect(vm.$el.querySelector('.js-empty-state h4').textContent.trim()).toEqual('Build with confidence'); expect(vm.$el.querySelector('.js-get-started-pipelines').getAttribute('href')).toEqual(paths.helpPagePath); @@ -192,7 +172,7 @@ describe('Pipelines', () => { describe('When API returns error', () => { beforeEach((done) => { - Vue.http.interceptors.push(errorInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(500, {}); vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: false, @@ -205,12 +185,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, errorInterceptor, - ); - }); - it('renders tabs', () => { expect(vm.$el.querySelector('.js-pipelines-tab-all').textContent.trim()).toContain('All'); }); @@ -230,7 +204,8 @@ describe('Pipelines', () => { describe('Without permission', () => { describe('With pipelines in main tab', () => { beforeEach((done) => { - Vue.http.interceptors.push(pipelinesInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, pipelines); + vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: false, @@ -243,12 +218,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, pipelinesInterceptor, - ); - }); - it('renders tabs', () => { expect(vm.$el.querySelector('.js-pipelines-tab-all').textContent.trim()).toContain('All'); }); @@ -268,7 +237,16 @@ describe('Pipelines', () => { describe('Without pipelines on main tab with CI', () => { beforeEach((done) => { - Vue.http.interceptors.push(emptyStateInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, { + pipelines: [], + count: { + all: 0, + pending: 0, + running: 0, + finished: 0, + }, + }); + vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: true, @@ -281,11 +259,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, emptyStateInterceptor, - ); - }); it('renders tabs', () => { expect(vm.$el.querySelector('.js-pipelines-tab-all').textContent.trim()).toContain('All'); }); @@ -303,7 +276,16 @@ describe('Pipelines', () => { describe('Without pipelines nor CI', () => { beforeEach((done) => { - Vue.http.interceptors.push(emptyStateInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, { + pipelines: [], + count: { + all: 0, + pending: 0, + running: 0, + finished: 0, + }, + }); + vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: false, @@ -316,12 +298,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, emptyStateInterceptor, - ); - }); - it('renders empty state without button to set CI', () => { expect(vm.$el.querySelector('.js-empty-state').textContent.trim()).toEqual('This project is not currently set up to run pipelines.'); expect(vm.$el.querySelector('.js-get-started-pipelines')).toBeNull(); @@ -337,7 +313,8 @@ describe('Pipelines', () => { describe('When API returns error', () => { beforeEach((done) => { - Vue.http.interceptors.push(errorInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(500, {}); + vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: false, @@ -350,12 +327,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, errorInterceptor, - ); - }); - it('renders tabs', () => { expect(vm.$el.querySelector('.js-pipelines-tab-all').textContent.trim()).toContain('All'); }); @@ -375,7 +346,8 @@ describe('Pipelines', () => { describe('successfull request', () => { describe('with pipelines', () => { beforeEach(() => { - Vue.http.interceptors.push(pipelinesInterceptor); + mock.onGet('twitter/flight/pipelines.json').reply(200, pipelines); + vm = mountComponent(PipelinesComponent, { store: new Store(), hasGitlabCi: true, @@ -384,12 +356,6 @@ describe('Pipelines', () => { }); }); - afterEach(() => { - Vue.http.interceptors = _.without( - Vue.http.interceptors, pipelinesInterceptor, - ); - }); - it('should render table', (done) => { setTimeout(() => { expect(vm.$el.querySelector('.table-holder')).toBeDefined(); @@ -703,4 +669,79 @@ describe('Pipelines', () => { }); }); }); + + describe('updates results when a staged is clicked', () => { + beforeEach(() => { + const copyPipeline = Object.assign({}, pipelineWithStages); + copyPipeline.id += 1; + mock + .onGet('twitter/flight/pipelines.json').reply(200, { + pipelines: [pipelineWithStages], + count: { + all: 1, + finished: 1, + pending: 0, + running: 0, + }, + }, { + 'POLL-INTERVAL': 100, + }) + .onGet(pipelineWithStages.details.stages[0].dropdown_path) + .reply(200, stageReply); + + vm = mountComponent(PipelinesComponent, { + store: new Store(), + hasGitlabCi: true, + canCreatePipeline: true, + ...paths, + }); + }); + + describe('when a request is being made', () => { + it('stops polling, cancels the request, fetches pipelines & restarts polling', (done) => { + spyOn(vm.poll, 'stop'); + spyOn(vm.poll, 'restart'); + spyOn(vm, 'getPipelines').and.returnValue(Promise.resolve()); + spyOn(vm.service.cancelationSource, 'cancel').and.callThrough(); + + setTimeout(() => { + vm.isMakingRequest = true; + return vm.$nextTick() + .then(() => { + vm.$el.querySelector('.js-builds-dropdown-button').click(); + }) + .then(() => { + expect(vm.service.cancelationSource.cancel).toHaveBeenCalled(); + expect(vm.poll.stop).toHaveBeenCalled(); + + setTimeout(() => { + expect(vm.getPipelines).toHaveBeenCalled(); + expect(vm.poll.restart).toHaveBeenCalled(); + done(); + }, 0); + }); + }, 0); + }); + }); + + describe('when no request is being made', () => { + it('stops polling, fetches pipelines & restarts polling', (done) => { + spyOn(vm.poll, 'stop'); + spyOn(vm.poll, 'restart'); + spyOn(vm, 'getPipelines').and.returnValue(Promise.resolve()); + + setTimeout(() => { + vm.$el.querySelector('.js-builds-dropdown-button').click(); + + expect(vm.poll.stop).toHaveBeenCalled(); + + setTimeout(() => { + expect(vm.getPipelines).toHaveBeenCalled(); + expect(vm.poll.restart).toHaveBeenCalled(); + done(); + }, 0); + }, 0); + }); + }); + }); }); |