diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2019-09-11 12:06:33 +0300 |
---|---|---|
committer | Kushal Pandya <kushalspandya@gmail.com> | 2019-09-11 12:06:33 +0300 |
commit | 48b98b5898e15ab4bb1db47e201fef8db68dc34d (patch) | |
tree | 70edcf4953d88d542243fe1d288ff249c02c9d9f /spec/javascripts | |
parent | bfaa96d586668678893e295062495f2c35b73c2a (diff) |
Enables Run Pipeline button to be rendered
In the Merge Request view, under pipelines tab
the user can see a run pipeline button
Adds axios post request to button click
Adds the logic to handle the user click,
refresh the table and disable the button while thee
request is being made
Updates UI for desktop and mobile
Adds specs
Regenerates potfile
Follow-up after review
Uses .finally to avoid code repetition
Diffstat (limited to 'spec/javascripts')
-rw-r--r-- | spec/javascripts/commit/pipelines/pipelines_spec.js | 167 |
1 files changed, 139 insertions, 28 deletions
diff --git a/spec/javascripts/commit/pipelines/pipelines_spec.js b/spec/javascripts/commit/pipelines/pipelines_spec.js index fec01b1f0a3..46aca2b7f03 100644 --- a/spec/javascripts/commit/pipelines/pipelines_spec.js +++ b/spec/javascripts/commit/pipelines/pipelines_spec.js @@ -1,6 +1,7 @@ import Vue from 'vue'; import MockAdapter from 'axios-mock-adapter'; import axios from '~/lib/utils/axios_utils'; +import Api from '~/api'; import pipelinesTable from '~/commit/pipelines/pipelines_table.vue'; import mountComponent from 'spec/helpers/vue_mount_component_helper'; @@ -10,6 +11,13 @@ describe('Pipelines table in Commits and Merge requests', function() { let PipelinesTable; let mock; let vm; + const props = { + endpoint: 'endpoint.json', + helpPagePath: 'foo', + emptyStateSvgPath: 'foo', + errorStateSvgPath: 'foo', + autoDevopsHelpPath: 'foo', + }; preloadFixtures(jsonFixtureName); @@ -32,13 +40,7 @@ describe('Pipelines table in Commits and Merge requests', function() { beforeEach(function() { mock.onGet('endpoint.json').reply(200, []); - vm = mountComponent(PipelinesTable, { - endpoint: 'endpoint.json', - helpPagePath: 'foo', - emptyStateSvgPath: 'foo', - errorStateSvgPath: 'foo', - autoDevopsHelpPath: 'foo', - }); + vm = mountComponent(PipelinesTable, props); }); it('should render the empty state', function(done) { @@ -54,13 +56,7 @@ describe('Pipelines table in Commits and Merge requests', function() { describe('with pipelines', () => { beforeEach(() => { mock.onGet('endpoint.json').reply(200, [pipeline]); - vm = mountComponent(PipelinesTable, { - endpoint: 'endpoint.json', - helpPagePath: 'foo', - emptyStateSvgPath: 'foo', - errorStateSvgPath: 'foo', - autoDevopsHelpPath: 'foo', - }); + vm = mountComponent(PipelinesTable, props); }); it('should render a table with the received pipelines', done => { @@ -111,30 +107,145 @@ describe('Pipelines table in Commits and Merge requests', function() { done(); }); - vm = mountComponent(PipelinesTable, { - endpoint: 'endpoint.json', - helpPagePath: 'foo', - emptyStateSvgPath: 'foo', - errorStateSvgPath: 'foo', - autoDevopsHelpPath: 'foo', - }); + vm = mountComponent(PipelinesTable, props); element.appendChild(vm.$el); }); }); }); + describe('run pipeline button', () => { + let pipelineCopy; + + beforeEach(() => { + pipelineCopy = Object.assign({}, pipeline); + }); + + describe('when latest pipeline has detached flag and canRunPipeline is true', () => { + it('renders the run pipeline button', done => { + pipelineCopy.flags.detached_merge_request_pipeline = true; + pipelineCopy.flags.merge_request_pipeline = true; + + mock.onGet('endpoint.json').reply(200, [pipelineCopy]); + + vm = mountComponent( + PipelinesTable, + Object.assign({}, props, { + canRunPipeline: true, + }), + ); + + setTimeout(() => { + expect(vm.$el.querySelector('.js-run-mr-pipeline')).not.toBeNull(); + done(); + }); + }); + }); + + describe('when latest pipeline has detached flag and canRunPipeline is false', () => { + it('does not render the run pipeline button', done => { + pipelineCopy.flags.detached_merge_request_pipeline = true; + pipelineCopy.flags.merge_request_pipeline = true; + + mock.onGet('endpoint.json').reply(200, [pipelineCopy]); + + vm = mountComponent( + PipelinesTable, + Object.assign({}, props, { + canRunPipeline: false, + }), + ); + + setTimeout(() => { + expect(vm.$el.querySelector('.js-run-mr-pipeline')).toBeNull(); + done(); + }); + }); + }); + + describe('when latest pipeline does not have detached flag and canRunPipeline is true', () => { + it('does not render the run pipeline button', done => { + pipelineCopy.flags.detached_merge_request_pipeline = false; + pipelineCopy.flags.merge_request_pipeline = false; + + mock.onGet('endpoint.json').reply(200, [pipelineCopy]); + + vm = mountComponent( + PipelinesTable, + Object.assign({}, props, { + canRunPipeline: true, + }), + ); + + setTimeout(() => { + expect(vm.$el.querySelector('.js-run-mr-pipeline')).toBeNull(); + done(); + }); + }); + }); + + describe('when latest pipeline does not have detached flag and merge_request_pipeline is true', () => { + it('does not render the run pipeline button', done => { + pipelineCopy.flags.detached_merge_request_pipeline = false; + pipelineCopy.flags.merge_request_pipeline = true; + + mock.onGet('endpoint.json').reply(200, [pipelineCopy]); + + vm = mountComponent( + PipelinesTable, + Object.assign({}, props, { + canRunPipeline: false, + }), + ); + + setTimeout(() => { + expect(vm.$el.querySelector('.js-run-mr-pipeline')).toBeNull(); + done(); + }); + }); + }); + + describe('on click', () => { + beforeEach(() => { + pipelineCopy.flags.detached_merge_request_pipeline = true; + + mock.onGet('endpoint.json').reply(200, [pipelineCopy]); + + vm = mountComponent( + PipelinesTable, + Object.assign({}, props, { + canRunPipeline: true, + projectId: '5', + mergeRequestId: 3, + }), + ); + }); + + it('updates the loading state', done => { + spyOn(Api, 'postMergeRequestPipeline').and.returnValue(Promise.resolve()); + + setTimeout(() => { + vm.$el.querySelector('.js-run-mr-pipeline').click(); + + vm.$nextTick(() => { + expect(vm.state.isRunningMergeRequestPipeline).toBe(true); + + setTimeout(() => { + expect(vm.state.isRunningMergeRequestPipeline).toBe(false); + + done(); + }); + }); + }); + }); + }); + }); + describe('unsuccessfull request', () => { beforeEach(() => { mock.onGet('endpoint.json').reply(500, []); - vm = mountComponent(PipelinesTable, { - endpoint: 'endpoint.json', - helpPagePath: 'foo', - emptyStateSvgPath: 'foo', - errorStateSvgPath: 'foo', - autoDevopsHelpPath: 'foo', - }); + vm = mountComponent(PipelinesTable, props); }); it('should render error state', function(done) { |