Add latest changes from gitlab-org/gitlab@master

3 files changed, 44 insertions, 4 deletions

diff --git a/spec/frontend/pipelines/graph/action_component_spec.js b/spec/frontend/pipelines/graph/action_component_spec.js
index f3aae21163b..fab6e6887b7 100644
--- a/spec/frontend/pipelines/graph/action_component_spec.js
+++ b/spec/frontend/pipelines/graph/action_component_spec.js
@@ -10,6 +10,7 @@ describe('pipeline graph action component', () => {
   let wrapper;
   let mock;
   const findButton = () => wrapper.find(GlButton);
+  const findTooltipWrapper = () => wrapper.find('[data-testid="ci-action-icon-tooltip-wrapper"]');
 
   beforeEach(() => {
     mock = new MockAdapter(axios);
@@ -31,14 +32,14 @@ describe('pipeline graph action component', () => {
   });
 
   it('should render the provided title as a bootstrap tooltip', () => {
-    expect(wrapper.attributes('title')).toBe('bar');
+    expect(findTooltipWrapper().attributes('title')).toBe('bar');
   });
 
   it('should update bootstrap tooltip when title changes', async () => {
     wrapper.setProps({ tooltipText: 'changed' });
 
     await nextTick();
-    expect(wrapper.attributes('title')).toBe('changed');
+    expect(findTooltipWrapper().attributes('title')).toBe('changed');
   });
 
   it('should render an svg', () => {
diff --git a/spec/frontend/pipelines/graph/job_item_spec.js b/spec/frontend/pipelines/graph/job_item_spec.js
index a6b3a96144a..23e7ed7ebb4 100644
--- a/spec/frontend/pipelines/graph/job_item_spec.js
+++ b/spec/frontend/pipelines/graph/job_item_spec.js
@@ -7,6 +7,7 @@ describe('pipeline graph job item', () => {
 
   const findJobWithoutLink = () => wrapper.find('[data-testid="job-without-link"]');
   const findJobWithLink = () => wrapper.find('[data-testid="job-with-link"]');
+  const findActionComponent = () => wrapper.find('[data-testid="ci-action-component"]');
 
   const createWrapper = (propsData) => {
     wrapper = mount(JobItem, {
@@ -69,6 +70,19 @@ describe('pipeline graph job item', () => {
       hasDetails: false,
     },
   };
+  const mockJobWithUnauthorizedAction = {
+    id: 4258,
+    name: 'stop-environment',
+    status: {
+      icon: 'status_manual',
+      label: 'manual stop action (not allowed)',
+      tooltip: 'manual action',
+      group: 'manual',
+      detailsPath: '/root/ci-mock/builds/4258',
+      hasDetails: true,
+      action: null,
+    },
+  };
 
   afterEach(() => {
     wrapper.destroy();
@@ -116,8 +130,21 @@ describe('pipeline graph job item', () => {
     it('it should render the action icon', () => {
       createWrapper({ job: mockJob });
 
-      expect(wrapper.find('.ci-action-icon-container').exists()).toBe(true);
-      expect(wrapper.find('.ci-action-icon-wrapper').exists()).toBe(true);
+      const actionComponent = findActionComponent();
+
+      expect(actionComponent.exists()).toBe(true);
+      expect(actionComponent.props('actionIcon')).toBe('retry');
+      expect(actionComponent.attributes('disabled')).not.toBe('disabled');
+    });
+
+    it('it should render disabled action icon when user cannot run the action', () => {
+      createWrapper({ job: mockJobWithUnauthorizedAction });
+
+      const actionComponent = findActionComponent();
+
+      expect(actionComponent.exists()).toBe(true);
+      expect(actionComponent.props('actionIcon')).toBe('stop');
+      expect(actionComponent.attributes('disabled')).toBe('disabled');
     });
   });
 
diff --git a/spec/frontend/pipelines/graph/mock_data.js b/spec/frontend/pipelines/graph/mock_data.js
index 41823bfdb9f..0cf7dc507f4 100644
--- a/spec/frontend/pipelines/graph/mock_data.js
+++ b/spec/frontend/pipelines/graph/mock_data.js
@@ -57,6 +57,7 @@ export const mockPipelineResponse = {
                             id: '7',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1482',
                             group: 'success',
@@ -106,6 +107,7 @@ export const mockPipelineResponse = {
                             id: '12',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1515',
                             group: 'success',
@@ -155,6 +157,7 @@ export const mockPipelineResponse = {
                             id: '17',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1484',
                             group: 'success',
@@ -204,6 +207,7 @@ export const mockPipelineResponse = {
                             id: '22',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1485',
                             group: 'success',
@@ -235,6 +239,7 @@ export const mockPipelineResponse = {
                             id: '25',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1486',
                             group: 'success',
@@ -266,6 +271,7 @@ export const mockPipelineResponse = {
                             id: '28',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1487',
                             group: 'success',
@@ -330,6 +336,7 @@ export const mockPipelineResponse = {
                             id: '35',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1514',
                             group: 'success',
@@ -413,6 +420,7 @@ export const mockPipelineResponse = {
                             id: '43',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1489',
                             group: 'success',
@@ -498,6 +506,7 @@ export const mockPipelineResponse = {
                             id: '50',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/jobs/1490',
                             group: 'success',
@@ -601,6 +610,7 @@ export const mockPipelineResponse = {
                             id: '60',
                             icon: 'status_success',
                             tooltip: null,
+                            label: null,
                             hasDetails: true,
                             detailsPath: '/root/kinder-pipe/-/pipelines/154',
                             group: 'success',
@@ -643,6 +653,7 @@ export const mockPipelineResponse = {
                             id: '64',
                             icon: 'status_success',
                             tooltip: null,
+                            label: null,
                             hasDetails: true,
                             detailsPath: '/root/abcd-dag/-/pipelines/153',
                             group: 'success',
@@ -850,6 +861,7 @@ export const wrappedPipelineReturn = {
                             id: '84',
                             icon: 'status_success',
                             tooltip: 'passed',
+                            label: 'passed',
                             hasDetails: true,
                             detailsPath: '/root/elemenohpee/-/jobs/1662',
                             group: 'success',