parent
0bc8440d4e
commit
cac2ed25d0
|
@ -0,0 +1,2 @@
|
||||||
|
// eslint-disable-next-line import/prefer-default-export
|
||||||
|
export const CANCEL_REQUEST = 'CANCEL_REQUEST';
|
|
@ -7,6 +7,7 @@ import SvgBlankState from '../components/blank_state.vue';
|
||||||
import LoadingIcon from '../../vue_shared/components/loading_icon.vue';
|
import LoadingIcon from '../../vue_shared/components/loading_icon.vue';
|
||||||
import PipelinesTableComponent from '../components/pipelines_table.vue';
|
import PipelinesTableComponent from '../components/pipelines_table.vue';
|
||||||
import eventHub from '../event_hub';
|
import eventHub from '../event_hub';
|
||||||
|
import { CANCEL_REQUEST } from '../constants';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
components: {
|
||||||
|
@ -65,15 +66,13 @@ export default {
|
||||||
updateTable() {
|
updateTable() {
|
||||||
// Cancel ongoing request
|
// Cancel ongoing request
|
||||||
if (this.isMakingRequest) {
|
if (this.isMakingRequest) {
|
||||||
this.service.cancelationSource.cancel();
|
this.service.cancelationSource.cancel(CANCEL_REQUEST);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Stop polling
|
// Stop polling
|
||||||
this.poll.stop();
|
this.poll.stop();
|
||||||
// make new request
|
// Update the table
|
||||||
this.getPipelines();
|
return this.getPipelines()
|
||||||
// restart polling
|
.then(() => this.poll.restart());
|
||||||
this.poll.restart();
|
|
||||||
},
|
},
|
||||||
fetchPipelines() {
|
fetchPipelines() {
|
||||||
if (!this.isMakingRequest) {
|
if (!this.isMakingRequest) {
|
||||||
|
@ -83,21 +82,29 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getPipelines() {
|
getPipelines() {
|
||||||
this.service.getPipelines(this.requestData)
|
return this.service.getPipelines(this.requestData)
|
||||||
.then(response => this.successCallback(response))
|
.then(response => this.successCallback(response))
|
||||||
.catch(() => this.errorCallback());
|
.catch((error) => this.errorCallback(error));
|
||||||
},
|
},
|
||||||
setCommonData(pipelines) {
|
setCommonData(pipelines) {
|
||||||
this.store.storePipelines(pipelines);
|
this.store.storePipelines(pipelines);
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
this.updateGraphDropdown = true;
|
this.updateGraphDropdown = true;
|
||||||
this.hasMadeRequest = true;
|
this.hasMadeRequest = true;
|
||||||
|
|
||||||
|
// In case the previous polling request returned an error, we need to reset it
|
||||||
|
if (this.hasError) {
|
||||||
|
this.hasError = false;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
errorCallback() {
|
errorCallback(error) {
|
||||||
this.hasError = true;
|
|
||||||
this.isLoading = false;
|
|
||||||
this.updateGraphDropdown = false;
|
|
||||||
this.hasMadeRequest = true;
|
this.hasMadeRequest = true;
|
||||||
|
this.isLoading = false;
|
||||||
|
|
||||||
|
if (error && error.message && error.message !== CANCEL_REQUEST) {
|
||||||
|
this.hasError = true;
|
||||||
|
this.updateGraphDropdown = false;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
setIsMakingRequest(isMakingRequest) {
|
setIsMakingRequest(isMakingRequest) {
|
||||||
this.isMakingRequest = isMakingRequest;
|
this.isMakingRequest = isMakingRequest;
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -4,6 +4,7 @@ import axios from '~/lib/utils/axios_utils';
|
||||||
import pipelinesComp from '~/pipelines/components/pipelines.vue';
|
import pipelinesComp from '~/pipelines/components/pipelines.vue';
|
||||||
import Store from '~/pipelines/stores/pipelines_store';
|
import Store from '~/pipelines/stores/pipelines_store';
|
||||||
import mountComponent from 'spec/helpers/vue_mount_component_helper';
|
import mountComponent from 'spec/helpers/vue_mount_component_helper';
|
||||||
|
import { pipelineWithStages, stageReply } from './mock_data';
|
||||||
|
|
||||||
describe('Pipelines', () => {
|
describe('Pipelines', () => {
|
||||||
const jsonFixtureName = 'pipelines/pipelines.json';
|
const jsonFixtureName = 'pipelines/pipelines.json';
|
||||||
|
@ -668,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);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
|
@ -2,6 +2,7 @@ import Vue from 'vue';
|
||||||
import MockAdapter from 'axios-mock-adapter';
|
import MockAdapter from 'axios-mock-adapter';
|
||||||
import axios from '~/lib/utils/axios_utils';
|
import axios from '~/lib/utils/axios_utils';
|
||||||
import stage from '~/pipelines/components/stage.vue';
|
import stage from '~/pipelines/components/stage.vue';
|
||||||
|
import eventHub from '~/pipelines/event_hub';
|
||||||
import mountComponent from 'spec/helpers/vue_mount_component_helper';
|
import mountComponent from 'spec/helpers/vue_mount_component_helper';
|
||||||
|
|
||||||
describe('Pipelines stage component', () => {
|
describe('Pipelines stage component', () => {
|
||||||
|
@ -43,13 +44,15 @@ describe('Pipelines stage component', () => {
|
||||||
mock.onGet('path.json').reply(200, { html: 'foo' });
|
mock.onGet('path.json').reply(200, { html: 'foo' });
|
||||||
});
|
});
|
||||||
|
|
||||||
it('should render the received data', done => {
|
it('should render the received data and emit `clickedDropdown` event', done => {
|
||||||
|
spyOn(eventHub, '$emit');
|
||||||
component.$el.querySelector('button').click();
|
component.$el.querySelector('button').click();
|
||||||
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
expect(
|
expect(
|
||||||
component.$el.querySelector('.js-builds-dropdown-container ul').textContent.trim(),
|
component.$el.querySelector('.js-builds-dropdown-container ul').textContent.trim(),
|
||||||
).toEqual('foo');
|
).toEqual('foo');
|
||||||
|
expect(eventHub.$emit).toHaveBeenCalledWith('clickedDropdown');
|
||||||
done();
|
done();
|
||||||
}, 0);
|
}, 0);
|
||||||
});
|
});
|
||||||
|
|
Loading…
Reference in New Issue