Merge branch 'move-boards-interceptor' into 'master'

Move Ajax interceptor into describe block

## What does this MR do?

Move registering the Vue resource interceptor for issue board mock data into the corresponding `describe` blocks.

## Why was this MR needed?

Currently, the interceptor is registered for every test (which makes them at best fail for Ajax calls using Vue resource).

See merge request !7304

spec/javascripts/boards/boards_store_spec.js.es6

@@ -13,8 +13,9 @@
 //= require boards/stores/boards_store
 //= require ./mock_data
 
-(() => {
+describe('Store', () => {
   beforeEach(() => {
+    Vue.http.interceptors.push(boardsMockInterceptor);
     gl.boardService = new BoardService('/test/issue-boards/board', '1');
     gl.issueBoards.BoardsStore.create();
 
@@ -24,145 +25,147 @@
     });
   });
 
-  describe('Store', () => {
-    it('starts with a blank state', () => {
-      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
-    });
+  afterEach(() => {
+    Vue.http.interceptors = _.without(Vue.http.interceptors, boardsMockInterceptor);
+  });
 
-    describe('lists', () => {
-      it('creates new list without persisting to DB', () => {
-        gl.issueBoards.BoardsStore.addList(listObj);
+  it('starts with a blank state', () => {
+    expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
+  });
 
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
-      });
+  describe('lists', () => {
+    it('creates new list without persisting to DB', () => {
+      gl.issueBoards.BoardsStore.addList(listObj);
 
-      it('finds list by ID', () => {
-        gl.issueBoards.BoardsStore.addList(listObj);
-        const list = gl.issueBoards.BoardsStore.findList('id', 1);
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
+    });
 
-        expect(list.id).toBe(1);
-      });
+    it('finds list by ID', () => {
+      gl.issueBoards.BoardsStore.addList(listObj);
+      const list = gl.issueBoards.BoardsStore.findList('id', 1);
 
-      it('finds list by type', () => {
-        gl.issueBoards.BoardsStore.addList(listObj);
-        const list = gl.issueBoards.BoardsStore.findList('type', 'label');
+      expect(list.id).toBe(1);
+    });
 
-        expect(list).toBeDefined();
-      });
+    it('finds list by type', () => {
+      gl.issueBoards.BoardsStore.addList(listObj);
+      const list = gl.issueBoards.BoardsStore.findList('type', 'label');
 
-      it('finds list limited by type', () => {
-        gl.issueBoards.BoardsStore.addList({
-          id: 1,
-          position: 0,
-          title: 'Test',
-          list_type: 'backlog'
-        });
-        const list = gl.issueBoards.BoardsStore.findList('id', 1, 'backlog');
+      expect(list).toBeDefined();
+    });
 
-        expect(list).toBeDefined();
+    it('finds list limited by type', () => {
+      gl.issueBoards.BoardsStore.addList({
+        id: 1,
+        position: 0,
+        title: 'Test',
+        list_type: 'backlog'
       });
+      const list = gl.issueBoards.BoardsStore.findList('id', 1, 'backlog');
 
-      it('gets issue when new list added', (done) => {
-        gl.issueBoards.BoardsStore.addList(listObj);
-        const list = gl.issueBoards.BoardsStore.findList('id', 1);
+      expect(list).toBeDefined();
+    });
 
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
+    it('gets issue when new list added', (done) => {
+      gl.issueBoards.BoardsStore.addList(listObj);
+      const list = gl.issueBoards.BoardsStore.findList('id', 1);
 
-        setTimeout(() => {
-          expect(list.issues.length).toBe(1);
-          expect(list.issues[0].id).toBe(1);
-          done();
-        }, 0);
-      });
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
 
-      it('persists new list', (done) => {
-        gl.issueBoards.BoardsStore.new({
-          title: 'Test',
-          type: 'label',
-          label: {
-            id: 1,
-            title: 'Testing',
-            color: 'red',
-            description: 'testing;'
-          }
-        });
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
-
-        setTimeout(() => {
-          const list = gl.issueBoards.BoardsStore.findList('id', 1);
-          expect(list).toBeDefined();
-          expect(list.id).toBe(1);
-          expect(list.position).toBe(0);
-          done();
-        }, 0);
-      });
+      setTimeout(() => {
+        expect(list.issues.length).toBe(1);
+        expect(list.issues[0].id).toBe(1);
+        done();
+      }, 0);
+    });
 
-      it('check for blank state adding', () => {
-        expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
+    it('persists new list', (done) => {
+      gl.issueBoards.BoardsStore.new({
+        title: 'Test',
+        type: 'label',
+        label: {
+          id: 1,
+          title: 'Testing',
+          color: 'red',
+          description: 'testing;'
+        }
       });
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
 
-      it('check for blank state not adding', () => {
-        gl.issueBoards.BoardsStore.addList(listObj);
-        expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(false);
-      });
+      setTimeout(() => {
+        const list = gl.issueBoards.BoardsStore.findList('id', 1);
+        expect(list).toBeDefined();
+        expect(list.id).toBe(1);
+        expect(list.position).toBe(0);
+        done();
+      }, 0);
+    });
 
-      it('check for blank state adding when backlog & done list exist', () => {
-        gl.issueBoards.BoardsStore.addList({
-          list_type: 'backlog'
-        });
-        gl.issueBoards.BoardsStore.addList({
-          list_type: 'done'
-        });
+    it('check for blank state adding', () => {
+      expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
+    });
+
+    it('check for blank state not adding', () => {
+      gl.issueBoards.BoardsStore.addList(listObj);
+      expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(false);
+    });
 
-        expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
+    it('check for blank state adding when backlog & done list exist', () => {
+      gl.issueBoards.BoardsStore.addList({
+        list_type: 'backlog'
       });
+      gl.issueBoards.BoardsStore.addList({
+        list_type: 'done'
+      });
+
+      expect(gl.issueBoards.BoardsStore.shouldAddBlankState()).toBe(true);
+    });
 
-      it('adds the blank state', () => {
-        gl.issueBoards.BoardsStore.addBlankState();
+    it('adds the blank state', () => {
+      gl.issueBoards.BoardsStore.addBlankState();
 
-        const list = gl.issueBoards.BoardsStore.findList('type', 'blank', 'blank');
-        expect(list).toBeDefined();
-      });
+      const list = gl.issueBoards.BoardsStore.findList('type', 'blank', 'blank');
+      expect(list).toBeDefined();
+    });
 
-      it('removes list from state', () => {
-        gl.issueBoards.BoardsStore.addList(listObj);
+    it('removes list from state', () => {
+      gl.issueBoards.BoardsStore.addList(listObj);
 
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(1);
 
-        gl.issueBoards.BoardsStore.removeList(1, 'label');
+      gl.issueBoards.BoardsStore.removeList(1, 'label');
 
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
-      });
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(0);
+    });
 
-      it('moves the position of lists', () => {
-        const listOne = gl.issueBoards.BoardsStore.addList(listObj),
-              listTwo = gl.issueBoards.BoardsStore.addList(listObjDuplicate);
+    it('moves the position of lists', () => {
+      const listOne = gl.issueBoards.BoardsStore.addList(listObj),
+            listTwo = gl.issueBoards.BoardsStore.addList(listObjDuplicate);
 
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
 
-        gl.issueBoards.BoardsStore.moveList(listOne, ['2', '1']);
+      gl.issueBoards.BoardsStore.moveList(listOne, ['2', '1']);
 
-        expect(listOne.position).toBe(1);
-      });
+      expect(listOne.position).toBe(1);
+    });
 
-      it('moves an issue from one list to another', (done) => {
-        const listOne = gl.issueBoards.BoardsStore.addList(listObj),
-              listTwo = gl.issueBoards.BoardsStore.addList(listObjDuplicate);
+    it('moves an issue from one list to another', (done) => {
+      const listOne = gl.issueBoards.BoardsStore.addList(listObj),
+            listTwo = gl.issueBoards.BoardsStore.addList(listObjDuplicate);
 
-        expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
+      expect(gl.issueBoards.BoardsStore.state.lists.length).toBe(2);
 
-        setTimeout(() => {
-          expect(listOne.issues.length).toBe(1);
-          expect(listTwo.issues.length).toBe(1);
+      setTimeout(() => {
+        expect(listOne.issues.length).toBe(1);
+        expect(listTwo.issues.length).toBe(1);
 
-          gl.issueBoards.BoardsStore.moveIssueToList(listOne, listTwo, listOne.findIssue(1));
+        gl.issueBoards.BoardsStore.moveIssueToList(listOne, listTwo, listOne.findIssue(1));
 
-          expect(listOne.issues.length).toBe(0);
-          expect(listTwo.issues.length).toBe(1);
+        expect(listOne.issues.length).toBe(0);
+        expect(listTwo.issues.length).toBe(1);
 
-          done();
-        }, 0);
-      });
+        done();
+      }, 0);
     });
   });
-})();
+});

spec/javascripts/boards/list_spec.js.es6

@@ -17,12 +17,17 @@ describe('List model', () => {
   let list;
 
   beforeEach(() => {
+    Vue.http.interceptors.push(boardsMockInterceptor);
     gl.boardService = new BoardService('/test/issue-boards/board', '1');
     gl.issueBoards.BoardsStore.create();
 
     list = new List(listObj);
   });
 
+  afterEach(() => {
+    Vue.http.interceptors = _.without(Vue.http.interceptors, boardsMockInterceptor);
+  });
+
   it('gets issues when created', (done) => {
     setTimeout(() => {
       expect(list.issues.length).toBe(1);

spec/javascripts/boards/mock_data.js.es6

@@ -48,10 +48,10 @@ const BoardsMockData = {
   }
 };
 
-Vue.http.interceptors.push((request, next) => {
+const boardsMockInterceptor = (request, next) => {
   const body = BoardsMockData[request.method][request.url];
 
   next(request.respondWith(JSON.stringify(body), {
     status: 200
   }));
-});
+};