Add latest changes from gitlab-org/gitlab@16-5-stable-eev16.5.0-rc42

6 files changed, 62 insertions, 70 deletions

diff --git a/spec/frontend/ci/job_details/components/log/collapsible_section_spec.js b/spec/frontend/ci/job_details/components/log/collapsible_section_spec.js
index e3d5c448338..5abf2a5ce53 100644
--- a/spec/frontend/ci/job_details/components/log/collapsible_section_spec.js
+++ b/spec/frontend/ci/job_details/components/log/collapsible_section_spec.js
@@ -1,6 +1,7 @@
 import { mount } from '@vue/test-utils';
 import { nextTick } from 'vue';
 import CollapsibleSection from '~/ci/job_details/components/log/collapsible_section.vue';
+import LogLine from '~/ci/job_details/components/log/line.vue';
 import LogLineHeader from '~/ci/job_details/components/log/line_header.vue';
 import { collapsibleSectionClosed, collapsibleSectionOpened } from './mock_data';
 
@@ -9,9 +10,9 @@ describe('Job Log Collapsible Section', () => {
 
   const jobLogEndpoint = 'jobs/335';
 
-  const findCollapsibleLine = () => wrapper.find('.collapsible-line');
-  const findCollapsibleLineSvg = () => wrapper.find('.collapsible-line svg');
   const findLogLineHeader = () => wrapper.findComponent(LogLineHeader);
+  const findLogLineHeaderSvg = () => findLogLineHeader().find('svg');
+  const findLogLines = () => wrapper.findAllComponents(LogLine);
 
   const createComponent = (props = {}) => {
     wrapper = mount(CollapsibleSection, {
@@ -30,11 +31,16 @@ describe('Job Log Collapsible Section', () => {
     });
 
     it('renders clickable header line', () => {
-      expect(findCollapsibleLine().attributes('role')).toBe('button');
+      expect(findLogLineHeader().text()).toBe('1 foo');
+      expect(findLogLineHeader().attributes('role')).toBe('button');
     });
 
-    it('renders an icon with the closed state', () => {
-      expect(findCollapsibleLineSvg().attributes('data-testid')).toBe('chevron-lg-right-icon');
+    it('renders an icon with a closed state', () => {
+      expect(findLogLineHeaderSvg().attributes('data-testid')).toBe('chevron-lg-right-icon');
+    });
+
+    it('does not render collapsed lines', () => {
+      expect(findLogLines()).toHaveLength(0);
     });
   });
 
@@ -47,15 +53,17 @@ describe('Job Log Collapsible Section', () => {
     });
 
     it('renders clickable header line', () => {
-      expect(findCollapsibleLine().attributes('role')).toBe('button');
+      expect(findLogLineHeader().text()).toContain('foo');
+      expect(findLogLineHeader().attributes('role')).toBe('button');
     });
 
     it('renders an icon with the open state', () => {
-      expect(findCollapsibleLineSvg().attributes('data-testid')).toBe('chevron-lg-down-icon');
+      expect(findLogLineHeaderSvg().attributes('data-testid')).toBe('chevron-lg-down-icon');
     });
 
-    it('renders collapsible lines content', () => {
-      expect(wrapper.findAll('.js-line').length).toEqual(collapsibleSectionOpened.lines.length);
+    it('renders collapsible lines', () => {
+      expect(findLogLines().at(0).text()).toContain('this is a collapsible nested section');
+      expect(findLogLines()).toHaveLength(collapsibleSectionOpened.lines.length);
     });
   });
 
@@ -65,7 +73,7 @@ describe('Job Log Collapsible Section', () => {
       jobLogEndpoint,
     });
 
-    findCollapsibleLine().trigger('click');
+    findLogLineHeader().trigger('click');
 
     await nextTick();
     expect(wrapper.emitted('onClickCollapsibleLine').length).toBe(1);
diff --git a/spec/frontend/ci/job_details/components/log/line_header_spec.js b/spec/frontend/ci/job_details/components/log/line_header_spec.js
index 7d1b05346f2..45296e4b6c2 100644
--- a/spec/frontend/ci/job_details/components/log/line_header_spec.js
+++ b/spec/frontend/ci/job_details/components/log/line_header_spec.js
@@ -16,7 +16,7 @@ describe('Job Log Header Line', () => {
           style: 'term-fg-l-green',
         },
       ],
-      lineNumber: 76,
+      lineNumber: 77,
     },
     isClosed: true,
     path: '/jashkenas/underscore/-/jobs/335',
diff --git a/spec/frontend/ci/job_details/components/log/line_number_spec.js b/spec/frontend/ci/job_details/components/log/line_number_spec.js
index d5c1d0fd985..db964e341b7 100644
--- a/spec/frontend/ci/job_details/components/log/line_number_spec.js
+++ b/spec/frontend/ci/job_details/components/log/line_number_spec.js
@@ -5,7 +5,7 @@ describe('Job Log Line Number', () => {
   let wrapper;
 
   const data = {
-    lineNumber: 0,
+    lineNumber: 1,
     path: '/jashkenas/underscore/-/jobs/335',
   };
 
diff --git a/spec/frontend/ci/job_details/components/log/line_spec.js b/spec/frontend/ci/job_details/components/log/line_spec.js
index b6f3a2b68df..dad41d0cd7f 100644
--- a/spec/frontend/ci/job_details/components/log/line_spec.js
+++ b/spec/frontend/ci/job_details/components/log/line_spec.js
@@ -224,7 +224,7 @@ describe('Job Log Line', () => {
             offset: 24526,
             content: [{ text: 'job log content' }],
             section: 'custom-section',
-            lineNumber: 76,
+            lineNumber: 77,
           },
           path: '/root/ci-project/-/jobs/6353',
         });
diff --git a/spec/frontend/ci/job_details/components/log/log_spec.js b/spec/frontend/ci/job_details/components/log/log_spec.js
index cc1621b87d6..1931d5046dc 100644
--- a/spec/frontend/ci/job_details/components/log/log_spec.js
+++ b/spec/frontend/ci/job_details/components/log/log_spec.js
@@ -7,7 +7,7 @@ import { scrollToElement } from '~/lib/utils/common_utils';
 import Log from '~/ci/job_details/components/log/log.vue';
 import LogLineHeader from '~/ci/job_details/components/log/line_header.vue';
 import { logLinesParser } from '~/ci/job_details/store/utils';
-import { jobLog } from './mock_data';
+import { mockJobLog, mockJobLogLineCount } from './mock_data';
 
 jest.mock('~/lib/utils/common_utils', () => ({
   ...jest.requireActual('~/lib/utils/common_utils'),
@@ -39,7 +39,7 @@ describe('Job Log', () => {
     };
 
     state = {
-      jobLog: logLinesParser(jobLog),
+      jobLog: logLinesParser(mockJobLog),
       jobLogEndpoint: 'jobs/id',
     };
 
@@ -57,15 +57,18 @@ describe('Job Log', () => {
       createComponent();
     });
 
-    it('renders a line number for each open line', () => {
-      expect(wrapper.find('#L1').text()).toBe('1');
-      expect(wrapper.find('#L2').text()).toBe('2');
-      expect(wrapper.find('#L3').text()).toBe('3');
-    });
+    it.each([...Array(mockJobLogLineCount).keys()])(
+      'renders a line number for each line %d',
+      (index) => {
+        const lineNumber = wrapper
+          .findAll('.js-log-line')
+          .at(index)
+          .find(`#L${index + 1}`);
 
-    it('links to the provided path and correct line number', () => {
-      expect(wrapper.find('#L1').attributes('href')).toBe(`${state.jobLogEndpoint}#L1`);
-    });
+        expect(lineNumber.text()).toBe(`${index + 1}`);
+        expect(lineNumber.attributes('href')).toBe(`${state.jobLogEndpoint}#L${index + 1}`);
+      },
+    );
   });
 
   describe('collapsible sections', () => {
@@ -103,7 +106,7 @@ describe('Job Log', () => {
 
         await waitForPromises();
 
-        expect(wrapper.find('#L6').exists()).toBe(false);
+        expect(wrapper.find('#L9').exists()).toBe(false);
         expect(scrollToElement).not.toHaveBeenCalled();
       });
     });
@@ -116,19 +119,19 @@ describe('Job Log', () => {
       it('scrolls to line number', async () => {
         createComponent();
 
-        state.jobLog = logLinesParser(jobLog, [], '#L6');
+        state.jobLog = logLinesParser(mockJobLog, [], '#L6');
         await waitForPromises();
 
         expect(scrollToElement).toHaveBeenCalledTimes(1);
 
-        state.jobLog = logLinesParser(jobLog, [], '#L7');
+        state.jobLog = logLinesParser(mockJobLog, [], '#L7');
         await waitForPromises();
 
         expect(scrollToElement).toHaveBeenCalledTimes(1);
       });
 
       it('line number within collapsed section is visible', () => {
-        state.jobLog = logLinesParser(jobLog, [], '#L6');
+        state.jobLog = logLinesParser(mockJobLog, [], '#L6');
 
         createComponent();
 
@@ -148,7 +151,7 @@ describe('Job Log', () => {
             ],
             section: 'prepare-executor',
             section_header: true,
-            lineNumber: 2,
+            lineNumber: 3,
           },
         ];
 
diff --git a/spec/frontend/ci/job_details/components/log/mock_data.js b/spec/frontend/ci/job_details/components/log/mock_data.js
index fa51b92a044..14669872cc1 100644
--- a/spec/frontend/ci/job_details/components/log/mock_data.js
+++ b/spec/frontend/ci/job_details/components/log/mock_data.js
@@ -1,4 +1,4 @@
-export const jobLog = [
+export const mockJobLog = [
   {
     offset: 1000,
     content: [{ text: 'Running with gitlab-runner 12.1.0 (de7731dd)' }],
@@ -19,69 +19,50 @@ export const jobLog = [
   },
   {
     offset: 1003,
-    content: [{ text: 'Starting service postgres:9.6.14 ...', style: 'text-green' }],
+    content: [{ text: 'Docker executor with image registry.gitlab.com ...' }],
     section: 'prepare-executor',
   },
   {
     offset: 1004,
-    content: [
-      {
-        text: 'Restore cache',
-        style: 'term-fg-l-cyan term-bold',
-      },
-    ],
-    section: 'restore-cache',
-    section_header: true,
-    section_options: {
-      collapsed: 'true',
-    },
+    content: [{ text: 'Starting service ...', style: 'term-fg-l-green' }],
+    section: 'prepare-executor',
   },
   {
     offset: 1005,
-    content: [
-      {
-        text: 'Checking cache for ruby-gems-debian-bullseye-ruby-3.0-16...',
-        style: 'term-fg-l-green term-bold',
-      },
-    ],
-    section: 'restore-cache',
-  },
-];
-
-export const utilsMockData = [
-  {
-    offset: 1001,
-    content: [{ text: ' on docker-auto-scale-com 8a6210b8' }],
+    content: [],
+    section: 'prepare-executor',
+    section_duration: '00:09',
   },
   {
-    offset: 1002,
+    offset: 1006,
     content: [
       {
-        text:
-          'Using Docker executor with image dev.gitlab.org:5005/gitlab/gitlab-build-images:ruby-2.6.6-golang-1.14-git-2.28-lfs-2.9-chrome-84-node-12.x-yarn-1.21-postgresql-11-graphicsmagick-1.3.34',
+        text: 'Getting source from Git repository',
       },
     ],
-    section: 'prepare-executor',
+    section: 'get-sources',
     section_header: true,
   },
   {
-    offset: 1003,
-    content: [{ text: 'Starting service postgres:9.6.14 ...' }],
-    section: 'prepare-executor',
+    offset: 1007,
+    content: [{ text: 'Fetching changes with git depth set to 20...' }],
+    section: 'get-sources',
   },
   {
-    offset: 1004,
-    content: [{ text: 'Pulling docker image postgres:9.6.14 ...', style: 'term-fg-l-green' }],
-    section: 'prepare-executor',
+    offset: 1008,
+    content: [{ text: 'Initialized empty Git repository', style: 'term-fg-l-green' }],
+    section: 'get-sources',
   },
   {
-    offset: 1005,
+    offset: 1009,
     content: [],
-    section: 'prepare-executor',
-    section_duration: '10:00',
+    section: 'get-sources',
+    section_duration: '00:19',
   },
 ];
 
+export const mockJobLogLineCount = 8; // `text` entries in mockJobLog
+
 export const originalTrace = [
   {
     offset: 1,
@@ -191,7 +172,7 @@ export const collapsibleSectionClosed = {
       offset: 80,
       content: [{ text: 'this is a collapsible nested section' }],
       section: 'prepare-script',
-      lineNumber: 3,
+      lineNumber: 2,
     },
   ],
 };
@@ -212,7 +193,7 @@ export const collapsibleSectionOpened = {
       offset: 80,
       content: [{ text: 'this is a collapsible nested section' }],
       section: 'prepare-script',
-      lineNumber: 3,
+      lineNumber: 2,
     },
   ],
 };