Resolve "Remove modal box confirmation when retrying a pipeline"

2 files changed, 29 insertions, 66 deletions

diff --git a/spec/javascripts/pipelines/async_button_spec.js b/spec/javascripts/pipelines/async_button_spec.js
deleted file mode 100644
index e0ea3649646..00000000000
--- a/spec/javascripts/pipelines/async_button_spec.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import Vue from 'vue';
-import asyncButtonComp from '~/pipelines/components/async_button.vue';
-import eventHub from '~/pipelines/event_hub';
-
-describe('Pipelines Async Button', () => {
-  let component;
-  let AsyncButtonComponent;
-
-  beforeEach(() => {
-    AsyncButtonComponent = Vue.extend(asyncButtonComp);
-
-    component = new AsyncButtonComponent({
-      propsData: {
-        endpoint: '/foo',
-        title: 'Foo',
-        icon: 'repeat',
-        cssClass: 'bar',
-        pipelineId: 123,
-        type: 'explode',
-      },
-    }).$mount();
-  });
-
-  it('should render a button', () => {
-    expect(component.$el.tagName).toEqual('BUTTON');
-  });
-
-  it('should render svg icon', () => {
-    expect(component.$el.querySelector('svg')).not.toBeNull();
-  });
-
-  it('should render the provided title', () => {
-    expect(component.$el.getAttribute('data-original-title')).toContain('Foo');
-    expect(component.$el.getAttribute('aria-label')).toContain('Foo');
-  });
-
-  it('should render the provided cssClass', () => {
-    expect(component.$el.getAttribute('class')).toContain('bar');
-  });
-
-  describe('With confirm dialog', () => {
-    it('should call the service when confimation is positive', () => {
-      eventHub.$on('openConfirmationModal', (data) => {
-        expect(data.pipelineId).toEqual(123);
-        expect(data.type).toEqual('explode');
-      });
-
-      component = new AsyncButtonComponent({
-        propsData: {
-          endpoint: '/foo',
-          title: 'Foo',
-          icon: 'fa fa-foo',
-          cssClass: 'bar',
-          pipelineId: 123,
-          type: 'explode',
-        },
-      }).$mount();
-
-      component.$el.click();
-    });
-  });
-});
diff --git a/spec/javascripts/pipelines/pipelines_table_row_spec.js b/spec/javascripts/pipelines/pipelines_table_row_spec.js
index de744739e42..05ca4cb9044 100644
--- a/spec/javascripts/pipelines/pipelines_table_row_spec.js
+++ b/spec/javascripts/pipelines/pipelines_table_row_spec.js
@@ -1,5 +1,6 @@
 import Vue from 'vue';
 import tableRowComp from '~/pipelines/components/pipelines_table_row.vue';
+import eventHub from '~/pipelines/event_hub';
 
 describe('Pipelines Table Row', () => {
   const jsonFixtureName = 'pipelines/pipelines.json';
@@ -151,13 +152,37 @@ describe('Pipelines Table Row', () => {
 
   describe('actions column', () => {
     beforeEach(() => {
-      component = buildComponent(pipeline);
+      const withActions = Object.assign({}, pipeline);
+      withActions.flags.cancelable = true;
+      withActions.flags.retryable = true;
+      withActions.cancel_path = '/cancel';
+      withActions.retry_path = '/retry';
+
+      component = buildComponent(withActions);
     });
 
     it('should render the provided actions', () => {
-      expect(
-        component.$el.querySelectorAll('.table-section:nth-child(6) ul li').length,
-      ).toEqual(pipeline.details.manual_actions.length);
+      expect(component.$el.querySelector('.js-pipelines-retry-button')).not.toBeNull();
+      expect(component.$el.querySelector('.js-pipelines-cancel-button')).not.toBeNull();
+    });
+
+    it('emits `retryPipeline` event when retry button is clicked and toggles loading', () => {
+      eventHub.$on('retryPipeline', (endpoint) => {
+        expect(endpoint).toEqual('/retry');
+      });
+
+      component.$el.querySelector('.js-pipelines-retry-button').click();
+      expect(component.isRetrying).toEqual(true);
+    });
+
+    it('emits `openConfirmationModal` event when cancel button is clicked and toggles loading', () => {
+      eventHub.$on('openConfirmationModal', (data) => {
+        expect(data.endpoint).toEqual('/cancel');
+        expect(data.pipelineId).toEqual(pipeline.id);
+      });
+
+      component.$el.querySelector('.js-pipelines-cancel-button').click();
+      expect(component.isCancelling).toEqual(true);
     });
   });
 });