Merge pull request #2398 from jpuzz0/RHOAIENG-1124-initial-pipeline-r…

…uns-cypress-setup

[RHOAIENG-1124] Initial pipeline runs global page test setup

frontend/src/__tests__/cypress/cypress/e2e/pipelines/PipelineRunsGlobal.cy.ts

@@ -0,0 +1,49 @@
+import { mockStatus } from '~/__mocks__/mockStatus';
+import { mockDashboardConfig } from '~/__mocks__/mockDashboardConfig';
+import { mockDataSciencePipelineApplicationK8sResource } from '~/__mocks__/mockDataSciencePipelinesApplicationK8sResource';
+import { mockRouteK8sResource } from '~/__mocks__/mockRouteK8sResource';
+import { mockK8sResourceList } from '~/__mocks__/mockK8sResourceList';
+import { mockProjectK8sResource } from '~/__mocks__/mockProjectK8sResource';
+import { pipelineRunsGlobal } from '~/__tests__/cypress/cypress/pages/pipelines';
+
+const projectName = 'test-project-name';
+
+describe('Pipeline Runs Global', () => {
+  beforeEach(() => {
+    initIntercepts();
+    pipelineRunsGlobal.visit(projectName);
+  });
+
+  it('renders the page with scheduled and triggered runs table data', () => {
+    // TODO
+  });
+});
+
+const initIntercepts = () => {
+  cy.intercept('/api/status', mockStatus());
+  cy.intercept('/api/config', mockDashboardConfig({}));
+  cy.intercept(
+    {
+      pathname: `/api/k8s/apis/datasciencepipelinesapplications.opendatahub.io/v1alpha1/namespaces/${projectName}/datasciencepipelinesapplications/pipelines-definition`,
+    },
+    mockDataSciencePipelineApplicationK8sResource({ namespace: projectName }),
+  );
+  cy.intercept(
+    {
+      pathname: `/api/k8s/apis/route.openshift.io/v1/namespaces/${projectName}/routes/ds-pipeline-pipelines-definition`,
+    },
+    mockRouteK8sResource({
+      notebookName: 'ds-pipeline-pipelines-definition',
+      namespace: projectName,
+    }),
+  );
+  cy.intercept(
+    {
+      pathname: '/api/k8s/apis/project.openshift.io/v1/projects',
+    },
+    mockK8sResourceList([
+      mockProjectK8sResource({ k8sName: projectName }),
+      mockProjectK8sResource({ k8sName: `${projectName}-2`, displayName: 'Test Project 2' }),
+    ]),
+  );
+};

frontend/src/__tests__/cypress/cypress/pages/pipelines/index.ts

@@ -3,3 +3,6 @@ export * from './pipelinesTable';
 export * from './pipelinesGlobal';
 export * from './pipelineImportModal';
 export * from './pipelineVersionImportModal';
+export * from './pipelineRunsGlobal';
+export * from './pipelineRunTable';
+export * from './pipelineRunJobTable';

frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelineRunJobTable.ts

@@ -0,0 +1,9 @@
+class PipelineRunJobTable {
+  private testId = 'pipeline-run-job-table';
+
+  find() {
+    return cy.findByTestId(this.testId);
+  }
+}
+
+export const pipelineRunJobTable = new PipelineRunJobTable();

frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelineRunTable.ts

@@ -0,0 +1,9 @@
+class PipelineRunTable {
+  private testId = 'pipeline-run-table';
+
+  find() {
+    return cy.findByTestId(this.testId);
+  }
+}
+
+export const pipelineRunTable = new PipelineRunTable();

frontend/src/__tests__/cypress/cypress/pages/pipelines/pipelineRunsGlobal.ts

@@ -0,0 +1,30 @@
+class PipelineRunsGlobal {
+  private testId = 'pipeline-runs-global-page';
+
+  visit(projectName: string) {
+    cy.visitWithLogin(`/pipelineRuns/${projectName}`);
+    this.find();
+  }
+
+  find() {
+    return cy.findByTestId(this.testId);
+  }
+
+  findScheduledTab() {
+    return cy.findByRole('tab', { name: 'Scheduled runs tab' });
+  }
+
+  findTriggeredTab() {
+    return cy.findByRole('tab', { name: 'Triggered runs tab' });
+  }
+
+  findProjectSelect() {
+    return this.find().findByTestId('project-selector-dropdown');
+  }
+
+  selectProjectByName(name: string) {
+    this.findProjectSelect().findDropdownItem(name).click();
+  }
+}
+
+export const pipelineRunsGlobal = new PipelineRunsGlobal();

frontend/src/concepts/pipelines/content/tables/pipelineRun/PipelineRunTable.tsx

@@ -120,6 +120,7 @@ const PipelineRunTable: React.FC<PipelineRunTableProps> = ({
         )}
         variant={TableVariant.compact}
         getColumnSort={getTableColumnSort({ columns: pipelineRunColumns, ...tableProps })}
+        data-testid="pipeline-run-table"
       />
       <DeletePipelineRunsModal
         toDeleteResources={deleteResources}

frontend/src/concepts/pipelines/content/tables/pipelineRunJob/PipelineRunJobTable.tsx

@@ -93,6 +93,7 @@ const PipelineRunJobTable: React.FC<PipelineRunTableProps> = ({
         )}
         variant={TableVariant.compact}
         getColumnSort={getTableColumnSort({ columns: pipelineRunJobColumns, ...tableProps })}
+        data-testid="pipeline-run-job-table"
       />
       <DeletePipelineRunsModal
         toDeleteResources={deleteResources}

frontend/src/pages/ApplicationsPage.tsx

@@ -33,6 +33,7 @@ type ApplicationsPageProps = {
   headerContent?: React.ReactNode;
   provideChildrenPadding?: boolean;
   jobReferenceName?: React.ReactNode;
+  testId?: string;
 };
 
 const ApplicationsPage: React.FC<ApplicationsPageProps> = ({
@@ -51,6 +52,7 @@ const ApplicationsPage: React.FC<ApplicationsPageProps> = ({
   headerContent,
   provideChildrenPadding,
   jobReferenceName,
+  testId,
 }) => {
   const renderHeader = () => (
     <PageSection variant={PageSectionVariants.light}>
@@ -136,11 +138,11 @@ const ApplicationsPage: React.FC<ApplicationsPageProps> = ({
   };
 
   return (
-    <>
+    <div data-testid={testId}>
       {breadcrumb && <PageBreadcrumb>{breadcrumb}</PageBreadcrumb>}
       {renderHeader()}
       {renderContents()}
-    </>
+    </div>
   );
 };
 

frontend/src/pages/pipelines/global/pipelines/GlobalPipelines.tsx

@@ -14,22 +14,19 @@ const GlobalPipelines: React.FC = () => {
   const pipelinesAPi = usePipelinesAPI();
 
   return (
-    <div data-testid="pipelines-global-page">
-      <PipelineCoreApplicationPage
-        title={pipelinesPageTitle}
-        description={pipelinesPageDescription}
-        headerAction={
-          <PipelineServerActions isDisabled={!pipelinesAPi.pipelinesServer.installed} />
-        }
-        getRedirectPath={(namespace) => `/pipelines/${namespace}`}
-      >
-        <EnsureAPIAvailability>
-          <PipelineAndVersionContextProvider>
-            <PipelinesView />
-          </PipelineAndVersionContextProvider>
-        </EnsureAPIAvailability>
-      </PipelineCoreApplicationPage>
-    </div>
+    <PipelineCoreApplicationPage
+      title={pipelinesPageTitle}
+      description={pipelinesPageDescription}
+      headerAction={<PipelineServerActions isDisabled={!pipelinesAPi.pipelinesServer.installed} />}
+      getRedirectPath={(namespace) => `/pipelines/${namespace}`}
+      testId="pipelines-global-page"
+    >
+      <EnsureAPIAvailability>
+        <PipelineAndVersionContextProvider>
+          <PipelinesView />
+        </PipelineAndVersionContextProvider>
+      </EnsureAPIAvailability>
+    </PipelineCoreApplicationPage>
   );
 };
 

frontend/src/pages/pipelines/global/runs/GlobalPipelineRuns.tsx

@@ -14,6 +14,7 @@ const GlobalPipelineRuns: React.FC = () => (
     description={pipelineRunsPageDescription}
     getRedirectPath={(namespace) => `/pipelineRuns/${namespace}`}
     overrideChildPadding
+    testId="pipeline-runs-global-page"
   >
     <EnsureAPIAvailability>
       <PipelineRunVersionsContextProvider>

frontend/src/pages/pipelines/global/runs/GlobalPipelineRunsTabs.tsx

@@ -31,7 +31,7 @@ const GlobalPipelineRunsTab: React.FC = () => {
       <Tab
         eventKey={PipelineRunType.Scheduled}
         title={<TabTitleText>Scheduled</TabTitleText>}
-        aria-label="Scheduled tab"
+        aria-label="Scheduled runs tab"
         className="odh-tabcontent-fix"
       >
         <PageSection isFilled variant="light">