6 files changed, 40 insertions, 61 deletions

diff --git a/spec/frontend/pipelines/components/pipeline_tabs_spec.js b/spec/frontend/pipelines/components/pipeline_tabs_spec.js
index 3680d9d62c7..c2cb95d4320 100644
--- a/spec/frontend/pipelines/components/pipeline_tabs_spec.js
+++ b/spec/frontend/pipelines/components/pipeline_tabs_spec.js
@@ -2,10 +2,6 @@ import { shallowMount } from '@vue/test-utils';
 import { GlTab } from '@gitlab/ui';
 import { extendedWrapper } from 'helpers/vue_test_utils_helper';
 import PipelineTabs from '~/pipelines/components/pipeline_tabs.vue';
-import PipelineGraphWrapper from '~/pipelines/components/graph/graph_component_wrapper.vue';
-import Dag from '~/pipelines/components/dag/dag.vue';
-import JobsApp from '~/pipelines/components/jobs/jobs_app.vue';
-import TestReports from '~/pipelines/components/test_reports/test_reports.vue';
 
 describe('The Pipeline Tabs', () => {
   let wrapper;
@@ -16,12 +12,6 @@ describe('The Pipeline Tabs', () => {
   const findPipelineTab = () => wrapper.findByTestId('pipeline-tab');
   const findTestsTab = () => wrapper.findByTestId('tests-tab');
 
-  const findDagApp = () => wrapper.findComponent(Dag);
-  const findFailedJobsApp = () => wrapper.findComponent(JobsApp);
-  const findJobsApp = () => wrapper.findComponent(JobsApp);
-  const findPipelineApp = () => wrapper.findComponent(PipelineGraphWrapper);
-  const findTestsApp = () => wrapper.findComponent(TestReports);
-
   const findFailedJobsBadge = () => wrapper.findByTestId('failed-builds-counter');
   const findJobsBadge = () => wrapper.findByTestId('builds-counter');
   const findTestsBadge = () => wrapper.findByTestId('tests-counter');
@@ -43,6 +33,7 @@ describe('The Pipeline Tabs', () => {
         },
         stubs: {
           GlTab,
+          RouterView: true,
         },
       }),
     );
@@ -54,17 +45,16 @@ describe('The Pipeline Tabs', () => {
 
   describe('Tabs', () => {
     it.each`
-      tabName          | tabComponent         | appComponent
-      ${'Pipeline'}    | ${findPipelineTab}   | ${findPipelineApp}
-      ${'Dag'}         | ${findDagTab}        | ${findDagApp}
-      ${'Jobs'}        | ${findJobsTab}       | ${findJobsApp}
-      ${'Failed Jobs'} | ${findFailedJobsTab} | ${findFailedJobsApp}
-      ${'Tests'}       | ${findTestsTab}      | ${findTestsApp}
-    `('shows $tabName tab with its associated component', ({ appComponent, tabComponent }) => {
+      tabName          | tabComponent
+      ${'Pipeline'}    | ${findPipelineTab}
+      ${'Dag'}         | ${findDagTab}
+      ${'Jobs'}        | ${findJobsTab}
+      ${'Failed Jobs'} | ${findFailedJobsTab}
+      ${'Tests'}       | ${findTestsTab}
+    `('shows $tabName tab', ({ tabComponent }) => {
       createComponent();
 
       expect(tabComponent().exists()).toBe(true);
-      expect(appComponent().exists()).toBe(true);
     });
 
     describe('with no failed jobs', () => {
diff --git a/spec/frontend/pipelines/mock_data.js b/spec/frontend/pipelines/mock_data.js
index 57d1511d859..36bce65dd56 100644
--- a/spec/frontend/pipelines/mock_data.js
+++ b/spec/frontend/pipelines/mock_data.js
@@ -730,6 +730,7 @@ export const mockPipelineTag = () => {
       },
       active: false,
       source: 'push',
+      name: 'Build pipeline',
       created_at: '2022-02-02T15:39:04.012Z',
       updated_at: '2022-02-02T15:40:59.573Z',
       path: '/root/mr-widgets/-/pipelines/311',
@@ -835,6 +836,7 @@ export const mockPipelineTag = () => {
         ],
         duration: 93,
         finished_at: '2022-02-02T15:40:59.384Z',
+        event_type_name: 'Pipeline',
         name: 'Pipeline',
         manual_actions: [],
         scheduled_actions: [],
@@ -954,6 +956,7 @@ export const mockPipelineBranch = () => {
       },
       active: false,
       source: 'push',
+      name: 'Build pipeline',
       created_at: '2022-01-14T17:40:27.866Z',
       updated_at: '2022-01-14T18:02:35.850Z',
       path: '/root/mr-widgets/-/pipelines/268',
@@ -1041,6 +1044,7 @@ export const mockPipelineBranch = () => {
         ],
         duration: 75,
         finished_at: '2022-01-14T18:02:35.842Z',
+        event_type_name: 'Pipeline',
         name: 'Pipeline',
         manual_actions: [],
         scheduled_actions: [],
diff --git a/spec/frontend/pipelines/pipeline_graph/utils_spec.js b/spec/frontend/pipelines/pipeline_graph/utils_spec.js
index d6b13da3c3a..41b020189d0 100644
--- a/spec/frontend/pipelines/pipeline_graph/utils_spec.js
+++ b/spec/frontend/pipelines/pipeline_graph/utils_spec.js
@@ -1,5 +1,5 @@
 import { createJobsHash, generateJobNeedsDict, getPipelineDefaultTab } from '~/pipelines/utils';
-import { TAB_QUERY_PARAM, validPipelineTabNames } from '~/pipelines/constants';
+import { validPipelineTabNames } from '~/pipelines/constants';
 
 describe('utils functions', () => {
   const jobName1 = 'build_1';
@@ -173,18 +173,25 @@ describe('utils functions', () => {
 
   describe('getPipelineDefaultTab', () => {
     const baseUrl = 'http://gitlab.com/user/multi-projects-small/-/pipelines/332/';
-    it('returns null if there was no `tab` params', () => {
+    it('returns null if there is only the base url', () => {
       expect(getPipelineDefaultTab(baseUrl)).toBe(null);
     });
 
-    it('returns null if there was no valid tab param', () => {
-      expect(getPipelineDefaultTab(`${baseUrl}?${TAB_QUERY_PARAM}=invalid`)).toBe(null);
+    it('returns null if there was no valid last url part', () => {
+      expect(getPipelineDefaultTab(`${baseUrl}something`)).toBe(null);
     });
 
     it('returns the correct tab name if present', () => {
       validPipelineTabNames.forEach((tabName) => {
-        expect(getPipelineDefaultTab(`${baseUrl}?${TAB_QUERY_PARAM}=${tabName}`)).toBe(tabName);
+        expect(getPipelineDefaultTab(`${baseUrl}${tabName}`)).toBe(tabName);
       });
     });
+
+    it('returns the right value even with query params', () => {
+      const [tabName] = validPipelineTabNames;
+      expect(getPipelineDefaultTab(`${baseUrl}${tabName}?query="something"&query2="else"`)).toBe(
+        tabName,
+      );
+    });
   });
 });
diff --git a/spec/frontend/pipelines/pipeline_tabs_spec.js b/spec/frontend/pipelines/pipeline_tabs_spec.js
index b184ce31d20..099748a5cca 100644
--- a/spec/frontend/pipelines/pipeline_tabs_spec.js
+++ b/spec/frontend/pipelines/pipeline_tabs_spec.js
@@ -1,9 +1,7 @@
-import { createAppOptions, createPipelineTabs } from '~/pipelines/pipeline_tabs';
-import { updateHistory } from '~/lib/utils/url_utility';
+import { createAppOptions } from '~/pipelines/pipeline_tabs';
 
 jest.mock('~/lib/utils/url_utility', () => ({
   removeParams: () => 'gitlab.com',
-  updateHistory: jest.fn(),
   joinPaths: () => {},
   setUrlFragment: () => {},
 }));
@@ -64,32 +62,4 @@ describe('~/pipelines/pipeline_tabs.js', () => {
       expect(createAppOptions('foo', null)).toBe(null);
     });
   });
-
-  describe('createPipelineTabs', () => {
-    const title = 'Pipeline Tabs';
-
-    beforeAll(() => {
-      document.title = title;
-    });
-
-    afterAll(() => {
-      document.title = '';
-    });
-
-    it('calls `updateHistory` with correct params', () => {
-      createPipelineTabs({});
-
-      expect(updateHistory).toHaveBeenCalledWith({
-        title,
-        url: 'gitlab.com',
-        replace: true,
-      });
-    });
-
-    it("returns early if options aren't provided", () => {
-      createPipelineTabs();
-
-      expect(updateHistory).not.toHaveBeenCalled();
-    });
-  });
 });
diff --git a/spec/frontend/pipelines/pipeline_url_spec.js b/spec/frontend/pipelines/pipeline_url_spec.js
index 1d66607e72b..c62898f0c83 100644
--- a/spec/frontend/pipelines/pipeline_url_spec.js
+++ b/spec/frontend/pipelines/pipeline_url_spec.js
@@ -1,3 +1,4 @@
+import { merge } from 'lodash';
 import { mockTracking, unmockTracking } from 'helpers/tracking_helper';
 import { shallowMountExtended } from 'helpers/vue_test_utils_helper';
 import PipelineUrlComponent from '~/pipelines/components/pipelines_list/pipeline_url.vue';
@@ -20,6 +21,7 @@ describe('Pipeline Url Component', () => {
   const findCommitRefName = () => wrapper.findByTestId('commit-ref-name');
 
   const findCommitTitleContainer = () => wrapper.findByTestId('commit-title-container');
+  const findPipelineNameContainer = () => wrapper.findByTestId('pipeline-name-container');
   const findCommitTitle = (commitWrapper) => commitWrapper.find('[data-testid="commit-title"]');
 
   const defaultProps = mockPipeline(projectPath);
@@ -51,7 +53,16 @@ describe('Pipeline Url Component', () => {
     expect(findPipelineUrlLink().text()).toBe('#1');
   });
 
-  it('should render the commit title, commit reference and commit-short-sha', () => {
+  it('should render the pipeline name instead of commit title', () => {
+    createComponent(merge(mockPipeline(projectPath), { pipeline: { name: 'Build pipeline' } }));
+
+    expect(findCommitTitleContainer().exists()).toBe(false);
+    expect(findPipelineNameContainer().exists()).toBe(true);
+    expect(findRefName().exists()).toBe(true);
+    expect(findCommitShortSha().exists()).toBe(true);
+  });
+
+  it('should render the commit title when pipeline has no name', () => {
     createComponent();
 
     const commitWrapper = findCommitTitleContainer();
@@ -59,6 +70,7 @@ describe('Pipeline Url Component', () => {
     expect(findCommitTitle(commitWrapper).exists()).toBe(true);
     expect(findRefName().exists()).toBe(true);
     expect(findCommitShortSha().exists()).toBe(true);
+    expect(findPipelineNameContainer().exists()).toBe(false);
   });
 
   describe('commit user avatar', () => {
@@ -142,7 +154,7 @@ describe('Pipeline Url Component', () => {
     });
 
     it('tracks commit title click', () => {
-      createComponent(mockPipelineBranch());
+      createComponent(merge(mockPipelineBranch(), { pipeline: { name: null } }));
 
       findCommitTitle(findCommitTitleContainer()).vm.$emit('click');
 
diff --git a/spec/frontend/pipelines/pipelines_actions_spec.js b/spec/frontend/pipelines/pipelines_actions_spec.js
index 26e61efc4f6..a70ef10aa7b 100644
--- a/spec/frontend/pipelines/pipelines_actions_spec.js
+++ b/spec/frontend/pipelines/pipelines_actions_spec.js
@@ -13,11 +13,7 @@ import GlCountdown from '~/vue_shared/components/gl_countdown.vue';
 import { TRACKING_CATEGORIES } from '~/pipelines/constants';
 
 jest.mock('~/flash');
-jest.mock('~/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal', () => {
-  return {
-    confirmAction: jest.fn(),
-  };
-});
+jest.mock('~/lib/utils/confirm_via_gl_modal/confirm_via_gl_modal');
 
 describe('Pipelines Actions dropdown', () => {
   let wrapper;