Mock Pager in Karma tests

spec/javascripts/activities_spec.js

@@ -3,24 +3,30 @@
 import $ from 'jquery';
 import 'vendor/jquery.endless-scroll';
 import Activities from '~/activities';
+import Pager from '~/pager';
 
-(() => {
+describe('Activities', () => {
   window.gon || (window.gon = {});
   const fixtureTemplate = 'static/event_filter.html.raw';
   const filters = [
     {
       id: 'all',
-    }, {
+    },
+    {
       id: 'push',
       name: 'push events',
-    }, {
+    },
+    {
       id: 'merged',
       name: 'merge events',
-    }, {
+    },
+    {
       id: 'comments',
-    }, {
+    },
+    {
       id: 'team',
-    }];
+    },
+  ];
 
   function getEventName(index) {
     const filter = filters[index];
@@ -32,31 +38,34 @@ import Activities from '~/activities';
     return `#${filter.id}_event_filter`;
   }
 
-  describe('Activities', () => {
+  beforeEach(() => {
-    beforeEach(() => {
+    loadFixtures(fixtureTemplate);
-      loadFixtures(fixtureTemplate);
+    spyOn(Pager, 'init').and.stub();
-      new Activities();
+    new Activities();
-    });
-
-    for (let i = 0; i < filters.length; i += 1) {
-      ((i) => {
-        describe(`when selecting ${getEventName(i)}`, () => {
-          beforeEach(() => {
-            $(getSelector(i)).click();
-          });
-
-          for (let x = 0; x < filters.length; x += 1) {
-            ((x) => {
-              const shouldHighlight = i === x;
-              const testName = shouldHighlight ? 'should highlight' : 'should not highlight';
-
-              it(`${testName} ${getEventName(x)}`, () => {
-                expect($(getSelector(x)).parent().hasClass('active')).toEqual(shouldHighlight);
-              });
-            })(x);
-          }
-        });
-      })(i);
-    }
   });
-})();
+
+  for (let i = 0; i < filters.length; i += 1) {
+    (i => {
+      describe(`when selecting ${getEventName(i)}`, () => {
+        beforeEach(() => {
+          $(getSelector(i)).click();
+        });
+
+        for (let x = 0; x < filters.length; x += 1) {
+          (x => {
+            const shouldHighlight = i === x;
+            const testName = shouldHighlight ? 'should highlight' : 'should not highlight';
+
+            it(`${testName} ${getEventName(x)}`, () => {
+              expect(
+                $(getSelector(x))
+                  .parent()
+                  .hasClass('active'),
+              ).toEqual(shouldHighlight);
+            });
+          })(x);
+        }
+      });
+    })(i);
+  }
+});

spec/javascripts/commits_spec.js

@@ -3,6 +3,7 @@ import 'vendor/jquery.endless-scroll';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
 import CommitsList from '~/commits';
+import Pager from '~/pager';
 
 describe('Commits List', () => {
   let commitsList;
@@ -14,6 +15,7 @@ describe('Commits List', () => {
       </form>
       <ol id="commits-list"></ol>
       `);
+    spyOn(Pager, 'init').and.stub();
     commitsList = new CommitsList(25);
   });
 
@@ -68,9 +70,10 @@ describe('Commits List', () => {
       mock.restore();
     });
 
-    it('should save the last search string', (done) => {
+    it('should save the last search string', done => {
       commitsList.searchField.val('GitLab');
-      commitsList.filterResults()
+      commitsList
+        .filterResults()
         .then(() => {
           expect(ajaxSpy).toHaveBeenCalled();
           expect(commitsList.lastSearch).toEqual('GitLab');
@@ -80,8 +83,9 @@ describe('Commits List', () => {
         .catch(done.fail);
     });
 
-    it('should not make ajax call if the input does not change', (done) => {
+    it('should not make ajax call if the input does not change', done => {
-      commitsList.filterResults()
+      commitsList
+        .filterResults()
         .then(() => {
           expect(ajaxSpy).not.toHaveBeenCalled();
           expect(commitsList.lastSearch).toEqual('');

spec/javascripts/pager_spec.js

@@ -1,13 +1,25 @@
+import $ from 'jquery';
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
 import Pager from '~/pager';
 
 describe('pager', () => {
+  let axiosMock;
+
+  beforeEach(() => {
+    axiosMock = new MockAdapter(axios);
+  });
+
+  afterEach(() => {
+    axiosMock.restore();
+  });
+
   describe('init', () => {
     const originalHref = window.location.href;
 
     beforeEach(() => {
       setFixtures('<div class="content_list"></div><div class="loading"></div>');
+      spyOn($.fn, 'endlessScroll').and.stub();
     });
 
     afterEach(() => {
@@ -46,33 +58,28 @@ describe('pager', () => {
 
   describe('getOld', () => {
     const urlRegex = /(.*)some_list(.*)$/;
-    let mock;
 
     function mockSuccess() {
-      mock.onGet(urlRegex).reply(200, {
+      axiosMock.onGet(urlRegex).reply(200, {
         count: 0,
         html: '',
       });
     }
 
     function mockError() {
-      mock.onGet(urlRegex).networkError();
+      axiosMock.onGet(urlRegex).networkError();
     }
 
     beforeEach(() => {
-      setFixtures('<div class="content_list" data-href="/some_list"></div><div class="loading"></div>');
+      setFixtures(
+        '<div class="content_list" data-href="/some_list"></div><div class="loading"></div>',
+      );
       spyOn(axios, 'get').and.callThrough();
 
-      mock = new MockAdapter(axios);
-
       Pager.init();
     });
 
-    afterEach(() => {
+    it('shows loader while loading next page', done => {
-      mock.restore();
-    });
-
-    it('shows loader while loading next page', (done) => {
       mockSuccess();
 
       spyOn(Pager.loading, 'show');
@@ -85,7 +92,7 @@ describe('pager', () => {
       });
     });
 
-    it('hides loader on success', (done) => {
+    it('hides loader on success', done => {
       mockSuccess();
 
       spyOn(Pager.loading, 'hide');
@@ -98,7 +105,7 @@ describe('pager', () => {
       });
     });
 
-    it('hides loader on error', (done) => {
+    it('hides loader on error', done => {
       mockError();
 
       spyOn(Pager.loading, 'hide');
@@ -111,7 +118,7 @@ describe('pager', () => {
       });
     });
 
-    it('sends request to url with offset and limit params', (done) => {
+    it('sends request to url with offset and limit params', done => {
       Pager.offset = 100;
       Pager.limit = 20;
       Pager.getOld();