diff --git a/app/assets/javascripts/lib/utils/poll.js b/app/assets/javascripts/lib/utils/poll.js index c30a1fcb5da..1d86ec19454 100644 --- a/app/assets/javascripts/lib/utils/poll.js +++ b/app/assets/javascripts/lib/utils/poll.js @@ -5,23 +5,37 @@ import httpStatusCodes from './http_status'; * Service for vue resouce and method need to be provided as props * * @example - * new poll({ + * new Poll({ * resource: resource, * method: 'name', * data: {page: 1, scope: 'all'}, * successCallback: () => {}, * errorCallback: () => {}, + * auxiliarCallback: () => {}, * }).makeRequest(); * - * this.service = new BoardsService(endpoint); - * new poll({ - * resource: this.service, - * method: 'get', - * data: {page: 1, scope: 'all'}, - * successCallback: () => {}, - * errorCallback: () => {}, - * }).makeRequest(); + * Usage in pipelines table with visibility lib: * + * const poll = new Poll({ + * resource: this.service, + * method: 'getPipelines', + * data: { page: pageNumber, scope }, + * successCallback: this.successCallback, + * errorCallback: this.errorCallback, + * auxiliarCallback: this.updateLoading, + * }); + * + * if (!Visibility.hidden()) { + * poll.makeRequest(); + * } + * + * Visibility.change(() => { + * if (!Visibility.hidden()) { + * poll.restart(); + * } else { + * poll.stop(); + * } +* }); * * 1. Checks for response and headers before start polling * 2. Interval is provided by `Poll-Interval` header. @@ -54,7 +68,10 @@ export default class Poll { } makeRequest() { - const { resource, method, data, errorCallback } = this.options; + const { resource, method, data, errorCallback, auxiliarCallback } = this.options; + + // It's called everytime a new request is made. Useful to update the status. + auxiliarCallback(true); return resource[method](data) .then(response => this.checkConditions(response)) @@ -70,4 +87,12 @@ export default class Poll { this.canPoll = false; clearTimeout(this.timeoutID); } + + /** + * Restarts polling after it has been stoped + */ + restart() { + this.canPoll = true; + this.makeRequest(); + } } diff --git a/spec/javascripts/lib/utils/poll_spec.js b/spec/javascripts/lib/utils/poll_spec.js index c794a632417..e3429c2a1cb 100644 --- a/spec/javascripts/lib/utils/poll_spec.js +++ b/spec/javascripts/lib/utils/poll_spec.js @@ -160,4 +160,44 @@ describe('Poll', () => { Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor); }); }); + + describe('restart', () => { + it('should restart polling when its called', (done) => { + const pollInterceptor = (request, next) => { + next(request.respondWith(JSON.stringify([]), { status: 200, headers: { 'poll-interval': 2 } })); + }; + + Vue.http.interceptors.push(pollInterceptor); + + const service = new ServiceMock('endpoint'); + + spyOn(service, 'fetch').and.callThrough(); + + const Polling = new Poll({ + resource: service, + method: 'fetch', + data: { page: 1 }, + successCallback: () => { + Polling.stop(); + setTimeout(() => { + Polling.restart(); + }, 0); + }, + errorCallback: callbacks.error, + }); + + spyOn(Polling, 'stop').and.callThrough(); + + Polling.makeRequest(); + + setTimeout(() => { + expect(service.fetch.calls.count()).toEqual(2); + expect(service.fetch).toHaveBeenCalledWith({ page: 1 }); + expect(Polling.stop).toHaveBeenCalled(); + done(); + }, 10); + + Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor); + }); + }); });