Resolve "Show CI pipeline status in Web IDE"

4 files changed, 231 insertions, 19 deletions

diff --git a/spec/javascripts/api_spec.js b/spec/javascripts/api_spec.js
index 3d7ccf432be..e8435116221 100644
--- a/spec/javascripts/api_spec.js
+++ b/spec/javascripts/api_spec.js
@@ -341,4 +341,25 @@ describe('Api', () => {
         .catch(done.fail);
     });
   });
+
+  describe('commitPipelines', () => {
+    it('fetches pipelines for a given commit', done => {
+      const projectId = 'example/foobar';
+      const commitSha = 'abc123def';
+      const expectedUrl = `${dummyUrlRoot}/${projectId}/commit/${commitSha}/pipelines`;
+      mock.onGet(expectedUrl).reply(200, [
+        {
+          name: 'test',
+        },
+      ]);
+
+      Api.commitPipelines(projectId, commitSha)
+        .then(({ data }) => {
+          expect(data.length).toBe(1);
+          expect(data[0].name).toBe('test');
+        })
+        .then(done)
+        .catch(done.fail);
+    });
+  });
 });
diff --git a/spec/javascripts/ide/mock_data.js b/spec/javascripts/ide/mock_data.js
index 7e641c7984b..c68ae050641 100644
--- a/spec/javascripts/ide/mock_data.js
+++ b/spec/javascripts/ide/mock_data.js
@@ -59,3 +59,37 @@ export const jobs = [
     duration: 1,
   },
 ];
+
+export const fullPipelinesResponse = {
+  data: {
+    count: {
+      all: 2,
+    },
+    pipelines: [
+      {
+        id: '51',
+        commit: {
+          id: 'xxxxxxxxxxxxxxxxxxxx',
+        },
+        details: {
+          status: {
+            icon: 'status_failed',
+            text: 'failed',
+          },
+        },
+      },
+      {
+        id: '50',
+        commit: {
+          id: 'abc123def456ghi789jkl',
+        },
+        details: {
+          status: {
+            icon: 'status_passed',
+            text: 'passed',
+          },
+        },
+      },
+    ],
+  },
+};
diff --git a/spec/javascripts/ide/stores/actions/project_spec.js b/spec/javascripts/ide/stores/actions/project_spec.js
index ebd08d95810..8e078ae7138 100644
--- a/spec/javascripts/ide/stores/actions/project_spec.js
+++ b/spec/javascripts/ide/stores/actions/project_spec.js
@@ -1,14 +1,33 @@
-import {
-  refreshLastCommitData,
-} from '~/ide/stores/actions';
+import Visibility from 'visibilityjs';
+import MockAdapter from 'axios-mock-adapter';
+import { refreshLastCommitData, pollSuccessCallBack } from '~/ide/stores/actions';
 import store from '~/ide/stores';
 import service from '~/ide/services';
+import axios from '~/lib/utils/axios_utils';
+import { fullPipelinesResponse } from '../../mock_data';
 import { resetStore } from '../../helpers';
 import testAction from '../../../helpers/vuex_action_helper';
 
 describe('IDE store project actions', () => {
+  const setProjectState = () => {
+    store.state.currentProjectId = 'abc/def';
+    store.state.currentBranchId = 'master';
+    store.state.projects['abc/def'] = {
+      id: 4,
+      path_with_namespace: 'abc/def',
+      branches: {
+        master: {
+          commit: {
+            id: 'abc123def456ghi789jkl',
+            title: 'example',
+          },
+        },
+      },
+    };
+  };
+
   beforeEach(() => {
-    store.state.projects.abcproject = {};
+    store.state.projects['abc/def'] = {};
   });
 
   afterEach(() => {
@@ -17,18 +36,16 @@ describe('IDE store project actions', () => {
 
   describe('refreshLastCommitData', () => {
     beforeEach(() => {
-      store.state.currentProjectId = 'abcproject';
+      store.state.currentProjectId = 'abc/def';
       store.state.currentBranchId = 'master';
-      store.state.projects.abcproject = {
+      store.state.projects['abc/def'] = {
+        id: 4,
         branches: {
           master: {
             commit: null,
           },
         },
       };
-    });
-
-    it('calls the service', done => {
       spyOn(service, 'getBranchData').and.returnValue(
         Promise.resolve({
           data: {
@@ -36,14 +53,16 @@ describe('IDE store project actions', () => {
           },
         }),
       );
+    });
 
+    it('calls the service', done => {
       store
         .dispatch('refreshLastCommitData', {
           projectId: store.state.currentProjectId,
           branchId: store.state.currentBranchId,
         })
         .then(() => {
-          expect(service.getBranchData).toHaveBeenCalledWith('abcproject', 'master');
+          expect(service.getBranchData).toHaveBeenCalledWith('abc/def', 'master');
 
           done();
         })
@@ -53,16 +72,118 @@ describe('IDE store project actions', () => {
     it('commits getBranchData', done => {
       testAction(
         refreshLastCommitData,
-        {},
-        {},
-        [{
-          type: 'SET_BRANCH_COMMIT',
-          payload: {
-            projectId: 'abcproject',
-            branchId: 'master',
-            commit: { id: '123' },
+        {
+          projectId: store.state.currentProjectId,
+          branchId: store.state.currentBranchId,
+        },
+        store.state,
+        [
+          {
+            type: 'SET_BRANCH_COMMIT',
+            payload: {
+              projectId: 'abc/def',
+              branchId: 'master',
+              commit: { id: '123' },
+            },
+          },
+        ], // mutations
+        [
+          {
+            type: 'getLastCommitPipeline',
+            payload: {
+              projectId: 'abc/def',
+              projectIdNumber: store.state.projects['abc/def'].id,
+              branchId: 'master',
+            },
+          },
+        ], // action
+        done,
+      );
+    });
+  });
+
+  describe('pipelinePoll', () => {
+    let mock;
+
+    beforeEach(() => {
+      setProjectState();
+      jasmine.clock().install();
+      mock = new MockAdapter(axios);
+      mock
+        .onGet('/abc/def/commit/abc123def456ghi789jkl/pipelines')
+        .reply(200, { data: { foo: 'bar' } }, { 'poll-interval': '10000' });
+    });
+
+    afterEach(() => {
+      jasmine.clock().uninstall();
+      mock.restore();
+      store.dispatch('stopPipelinePolling');
+    });
+
+    it('calls service periodically', done => {
+      spyOn(axios, 'get').and.callThrough();
+      spyOn(Visibility, 'hidden').and.returnValue(false);
+
+      store
+        .dispatch('pipelinePoll')
+        .then(() => {
+          jasmine.clock().tick(1000);
+
+          expect(axios.get).toHaveBeenCalled();
+          expect(axios.get.calls.count()).toBe(1);
+        })
+        .then(() => new Promise(resolve => requestAnimationFrame(resolve)))
+        .then(() => {
+          jasmine.clock().tick(10000);
+          expect(axios.get.calls.count()).toBe(2);
+        })
+        .then(() => new Promise(resolve => requestAnimationFrame(resolve)))
+        .then(() => {
+          jasmine.clock().tick(10000);
+          expect(axios.get.calls.count()).toBe(3);
+        })
+        .then(() => new Promise(resolve => requestAnimationFrame(resolve)))
+        .then(() => {
+          jasmine.clock().tick(10000);
+          expect(axios.get.calls.count()).toBe(4);
+        })
+
+        .then(done)
+        .catch(done.fail);
+    });
+  });
+
+  describe('pollSuccessCallBack', () => {
+    beforeEach(() => {
+      setProjectState();
+    });
+
+    it('commits correct pipeline', done => {
+      testAction(
+        pollSuccessCallBack,
+        fullPipelinesResponse,
+        store.state,
+        [
+          {
+            type: 'SET_LAST_COMMIT_PIPELINE',
+            payload: {
+              projectId: 'abc/def',
+              branchId: 'master',
+              pipeline: {
+                id: '50',
+                commit: {
+                  id: 'abc123def456ghi789jkl',
+                },
+                details: {
+                  status: {
+                    icon: 'status_passed',
+                    text: 'passed',
+                  },
+                },
+              },
+            },
           },
-        }], // mutations
+        ], // mutations
         [], // action
         done,
       );
diff --git a/spec/javascripts/ide/stores/mutations/branch_spec.js b/spec/javascripts/ide/stores/mutations/branch_spec.js
index 29eb859ddaf..f2f1f2a9a2e 100644
--- a/spec/javascripts/ide/stores/mutations/branch_spec.js
+++ b/spec/javascripts/ide/stores/mutations/branch_spec.js
@@ -37,4 +37,40 @@ describe('Multi-file store branch mutations', () => {
       expect(localState.projects.Example.branches.master.commit.title).toBe('Example commit');
     });
   });
+
+  describe('SET_LAST_COMMIT_PIPELINE', () => {
+    it('sets the pipeline for the last commit on current project', () => {
+      localState.projects = {
+        Example: {
+          branches: {
+            master: {
+              commit: {},
+            },
+          },
+        },
+      };
+
+      mutations.SET_LAST_COMMIT_PIPELINE(localState, {
+        projectId: 'Example',
+        branchId: 'master',
+        pipeline: {
+          id: '50',
+          details: {
+            status: {
+              icon: 'status_passed',
+              text: 'passed',
+            },
+          },
+        },
+      });
+
+      expect(localState.projects.Example.branches.master.commit.pipeline.id).toBe('50');
+      expect(localState.projects.Example.branches.master.commit.pipeline.details.status.text).toBe(
+        'passed',
+      );
+      expect(localState.projects.Example.branches.master.commit.pipeline.details.status.icon).toBe(
+        'status_passed',
+      );
+    });
+  });
 });