Add latest changes from gitlab-org/gitlab@master

2 files changed, 31 insertions, 23 deletions

diff --git a/spec/frontend/pipelines/components/pipelines_list/failure_widget/failed_job_details_spec.js b/spec/frontend/pipelines/components/pipelines_list/failure_widget/failed_job_details_spec.js
index 9cd8ea66797..479ee854ecf 100644
--- a/spec/frontend/pipelines/components/pipelines_list/failure_widget/failed_job_details_spec.js
+++ b/spec/frontend/pipelines/components/pipelines_list/failure_widget/failed_job_details_spec.js
@@ -46,8 +46,7 @@ describe('FailedJobDetails component', () => {
 
   const findArrowIcon = () => wrapper.findComponent(GlIcon);
   const findJobId = () => wrapper.findComponent(GlLink);
-  const findHiddenJobLog = () => wrapper.findByTestId('log-is-hidden');
-  const findVisibleJobLog = () => wrapper.findByTestId('log-is-visible');
+  const findJobLog = () => wrapper.findByTestId('job-log');
   const findJobName = () => wrapper.findByText(defaultProps.job.name);
   const findRetryButton = () => wrapper.findByLabelText('Retry');
   const findRow = () => wrapper.findByTestId('widget-row');
@@ -79,8 +78,7 @@ describe('FailedJobDetails component', () => {
     });
 
     it('does not renders the job lob', () => {
-      expect(findHiddenJobLog().exists()).toBe(true);
-      expect(findVisibleJobLog().exists()).toBe(false);
+      expect(findJobLog().exists()).toBe(false);
     });
   });
 
@@ -189,13 +187,11 @@ describe('FailedJobDetails component', () => {
       });
 
       it('does not renders the received html of the job log', () => {
-        expect(findVisibleJobLog().html()).not.toContain(defaultProps.job.trace.htmlSummary);
+        expect(findJobLog().html()).not.toContain(defaultProps.job.trace.htmlSummary);
       });
 
       it('shows a permission error message', () => {
-        expect(findVisibleJobLog().text()).toBe(
-          "You do not have permission to read this job's log.",
-        );
+        expect(findJobLog().text()).toBe("You do not have permission to read this job's log.");
       });
     });
 
@@ -211,8 +207,7 @@ describe('FailedJobDetails component', () => {
 
         describe('while collapsed', () => {
           it('expands the job log', () => {
-            expect(findHiddenJobLog().exists()).toBe(false);
-            expect(findVisibleJobLog().exists()).toBe(true);
+            expect(findJobLog().exists()).toBe(true);
           });
 
           it('renders the down arrow', () => {
@@ -220,19 +215,17 @@ describe('FailedJobDetails component', () => {
           });
 
           it('renders the received html of the job log', () => {
-            expect(findVisibleJobLog().html()).toContain(defaultProps.job.trace.htmlSummary);
+            expect(findJobLog().html()).toContain(defaultProps.job.trace.htmlSummary);
           });
         });
 
         describe('while expanded', () => {
           it('collapes the job log', async () => {
-            expect(findHiddenJobLog().exists()).toBe(false);
-            expect(findVisibleJobLog().exists()).toBe(true);
+            expect(findJobLog().exists()).toBe(true);
 
             await findRow().trigger('click');
 
-            expect(findHiddenJobLog().exists()).toBe(true);
-            expect(findVisibleJobLog().exists()).toBe(false);
+            expect(findJobLog().exists()).toBe(false);
           });
 
           it('renders the right arrow', async () => {
@@ -247,14 +240,12 @@ describe('FailedJobDetails component', () => {
 
       describe('when clicking on a link element within the row', () => {
         it('does not expands/collapse the job log', async () => {
-          expect(findHiddenJobLog().exists()).toBe(true);
-          expect(findVisibleJobLog().exists()).toBe(false);
+          expect(findJobLog().exists()).toBe(false);
           expect(findArrowIcon().props().name).toBe('chevron-right');
 
           await findJobId().vm.$emit('click');
 
-          expect(findHiddenJobLog().exists()).toBe(true);
-          expect(findVisibleJobLog().exists()).toBe(false);
+          expect(findJobLog().exists()).toBe(false);
           expect(findArrowIcon().props().name).toBe('chevron-right');
         });
       });
diff --git a/spec/frontend/pipelines/components/pipelines_list/failure_widget/pipeline_failed_jobs_widget_spec.js b/spec/frontend/pipelines/components/pipelines_list/failure_widget/pipeline_failed_jobs_widget_spec.js
index 32addb2a08a..5bbb874edb0 100644
--- a/spec/frontend/pipelines/components/pipelines_list/failure_widget/pipeline_failed_jobs_widget_spec.js
+++ b/spec/frontend/pipelines/components/pipelines_list/failure_widget/pipeline_failed_jobs_widget_spec.js
@@ -34,6 +34,7 @@ describe('PipelineFailedJobsWidget component', () => {
     });
   };
 
+  const findFailedJobsCard = () => wrapper.findByTestId('failed-jobs-card');
   const findFailedJobsButton = () => wrapper.findComponent(GlButton);
   const findFailedJobsList = () => wrapper.findAllComponents(FailedJobsList);
   const findInfoIcon = () => wrapper.findComponent(GlIcon);
@@ -46,7 +47,7 @@ describe('PipelineFailedJobsWidget component', () => {
 
     it('renders the show failed jobs button with a count of 0', () => {
       expect(findFailedJobsButton().exists()).toBe(true);
-      expect(findFailedJobsButton().text()).toBe('Show failed jobs (0)');
+      expect(findFailedJobsButton().text()).toBe('Failed jobs (0)');
     });
   });
 
@@ -57,9 +58,7 @@ describe('PipelineFailedJobsWidget component', () => {
 
     it('renders the show failed jobs button with correct count', () => {
       expect(findFailedJobsButton().exists()).toBe(true);
-      expect(findFailedJobsButton().text()).toBe(
-        `Show failed jobs (${defaultProps.failedJobsCount})`,
-      );
+      expect(findFailedJobsButton().text()).toBe(`Failed jobs (${defaultProps.failedJobsCount})`);
     });
 
     it('renders the info icon', () => {
@@ -84,6 +83,24 @@ describe('PipelineFailedJobsWidget component', () => {
     it('renders the failed jobs widget', () => {
       expect(findFailedJobsList().exists()).toBe(true);
     });
+
+    it('removes the CSS border classes', () => {
+      expect(findFailedJobsCard().attributes('class')).not.toContain(
+        'gl-border-white gl-hover-border-gray-100',
+      );
+    });
+  });
+
+  describe('when the job details are not expanded', () => {
+    beforeEach(() => {
+      createComponent();
+    });
+
+    it('has the CSS border classes', () => {
+      expect(findFailedJobsCard().attributes('class')).toContain(
+        'gl-border-white gl-hover-border-gray-100',
+      );
+    });
   });
 
   describe('when the job count changes', () => {