Fixed random failures with Poll spec

Correctly waits for requests to finish before testing anything.
Previously it was waiting for a set amount of time which could possibly
cause failures dependant on how quickly these execute

Stops any polling requests once done so that the error callback doesn't
get called with a 404

Closes #30824

spec/javascripts/lib/utils/poll_spec.js

@@ -4,6 +4,20 @@ import Poll from '~/lib/utils/poll';
 
 Vue.use(VueResource);
 
+const waitForAllCallsToFinish = (service, waitForCount, successCallback) => {
+  const timer = () => {
+    setTimeout(() => {
+      if (service.fetch.calls.count() === waitForCount) {
+        successCallback();
+      } else {
+        timer();
+      }
+    }, 5);
+  };
+
+  timer();
+};
+
 class ServiceMock {
   constructor(endpoint) {
     this.service = Vue.resource(endpoint);
@@ -16,6 +30,7 @@ class ServiceMock {
 
 describe('Poll', () => {
   let callbacks;
+  let service;
 
   beforeEach(() => {
     callbacks = {
@@ -23,8 +38,11 @@ describe('Poll', () => {
       error: () => {},
     };
 
+    service = new ServiceMock('endpoint');
+
     spyOn(callbacks, 'success');
     spyOn(callbacks, 'error');
+    spyOn(service, 'fetch').and.callThrough();
   });
 
   it('calls the success callback when no header for interval is provided', (done) => {
@@ -35,19 +53,20 @@ describe('Poll', () => {
     Vue.http.interceptors.push(successInterceptor);
 
     new Poll({
-      resource: new ServiceMock('endpoint'),
+      resource: service,
       method: 'fetch',
       successCallback: callbacks.success,
       errorCallback: callbacks.error,
     }).makeRequest();
 
-    setTimeout(() => {
+    waitForAllCallsToFinish(service, 1, () => {
       expect(callbacks.success).toHaveBeenCalled();
       expect(callbacks.error).not.toHaveBeenCalled();
+
+      Vue.http.interceptors = _.without(Vue.http.interceptors, successInterceptor);
+
       done();
     }, 0);
-
-    Vue.http.interceptors = _.without(Vue.http.interceptors, successInterceptor);
   });
 
   it('calls the error callback whe the http request returns an error', (done) => {
@@ -58,19 +77,19 @@ describe('Poll', () => {
     Vue.http.interceptors.push(errorInterceptor);
 
     new Poll({
-      resource: new ServiceMock('endpoint'),
+      resource: service,
       method: 'fetch',
       successCallback: callbacks.success,
       errorCallback: callbacks.error,
     }).makeRequest();
 
-    setTimeout(() => {
+    waitForAllCallsToFinish(service, 1, () => {
       expect(callbacks.success).not.toHaveBeenCalled();
       expect(callbacks.error).toHaveBeenCalled();
-      done();
-    }, 0);
+      Vue.http.interceptors = _.without(Vue.http.interceptors, errorInterceptor);
 
-    Vue.http.interceptors = _.without(Vue.http.interceptors, errorInterceptor);
+      done();
+    });
   });
 
   it('should call the success callback when the interval header is -1', (done) => {
@@ -81,7 +100,7 @@ describe('Poll', () => {
     Vue.http.interceptors.push(intervalInterceptor);
 
     new Poll({
-      resource: new ServiceMock('endpoint'),
+      resource: service,
       method: 'fetch',
       successCallback: callbacks.success,
       errorCallback: callbacks.error,
@@ -90,10 +109,11 @@ describe('Poll', () => {
     setTimeout(() => {
       expect(callbacks.success).toHaveBeenCalled();
       expect(callbacks.error).not.toHaveBeenCalled();
+
+      Vue.http.interceptors = _.without(Vue.http.interceptors, intervalInterceptor);
+
       done();
     }, 0);
-
-    Vue.http.interceptors = _.without(Vue.http.interceptors, intervalInterceptor);
   });
 
   it('starts polling when http status is 200 and interval header is provided', (done) => {
@@ -103,26 +123,28 @@ describe('Poll', () => {
 
     Vue.http.interceptors.push(pollInterceptor);
 
-    const service = new ServiceMock('endpoint');
-    spyOn(service, 'fetch').and.callThrough();
-
-    new Poll({
+    const Polling = new Poll({
       resource: service,
       method: 'fetch',
       data: { page: 1 },
       successCallback: callbacks.success,
       errorCallback: callbacks.error,
-    }).makeRequest();
+    });
+
+    Polling.makeRequest();
+
+    waitForAllCallsToFinish(service, 2, () => {
+      Polling.stop();
 
-    setTimeout(() => {
       expect(service.fetch.calls.count()).toEqual(2);
       expect(service.fetch).toHaveBeenCalledWith({ page: 1 });
       expect(callbacks.success).toHaveBeenCalled();
       expect(callbacks.error).not.toHaveBeenCalled();
-      done();
-    }, 5);
 
-    Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor);
+      Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor);
+
+      done();
+    });
   });
 
   describe('stop', () => {
@@ -133,9 +155,6 @@ describe('Poll', () => {
 
       Vue.http.interceptors.push(pollInterceptor);
 
-      const service = new ServiceMock('endpoint');
-      spyOn(service, 'fetch').and.callThrough();
-
       const Polling = new Poll({
         resource: service,
         method: 'fetch',
@@ -150,14 +169,15 @@ describe('Poll', () => {
 
       Polling.makeRequest();
 
-      setTimeout(() => {
+      waitForAllCallsToFinish(service, 1, () => {
         expect(service.fetch.calls.count()).toEqual(1);
         expect(service.fetch).toHaveBeenCalledWith({ page: 1 });
         expect(Polling.stop).toHaveBeenCalled();
-        done();
-      }, 100);
 
-      Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor);
+        Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor);
+
+        done();
+      });
     });
   });
 
@@ -169,10 +189,6 @@ describe('Poll', () => {
 
       Vue.http.interceptors.push(pollInterceptor);
 
-      const service = new ServiceMock('endpoint');
-
-      spyOn(service, 'fetch').and.callThrough();
-
       const Polling = new Poll({
         resource: service,
         method: 'fetch',
@@ -187,17 +203,22 @@ describe('Poll', () => {
       });
 
       spyOn(Polling, 'stop').and.callThrough();
+      spyOn(Polling, 'restart').and.callThrough();
 
       Polling.makeRequest();
 
-      setTimeout(() => {
+      waitForAllCallsToFinish(service, 2, () => {
+        Polling.stop();
+
         expect(service.fetch.calls.count()).toEqual(2);
         expect(service.fetch).toHaveBeenCalledWith({ page: 1 });
         expect(Polling.stop).toHaveBeenCalled();
-        done();
-      }, 10);
+        expect(Polling.restart).toHaveBeenCalled();
 
-      Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor);
+        Vue.http.interceptors = _.without(Vue.http.interceptors, pollInterceptor);
+
+        done();
+      });
     });
   });
 });