ODC-7593: Automation of pipeline overview page

.gitignore

@@ -2,6 +2,7 @@ node_modules/
 dist/
 /coverage
 .devcontainer/dev.env
+integration-tests/gui_test_screenshots
 integration-tests/videos
 integration-tests/screenshots
 yarn-error.log

integration-tests/cypress/features/pipelines/pipeline-overview.feature

@@ -0,0 +1,37 @@
+@pipelines
+Feature: Pipelines overview page
+              As a developer, I would like to view pipeline overview page in Administrator view 
+
+
+        Background:
+            Given user is at Administrator perspective
+              And user clicks on Pipelines Tab
+              And user has created or selected namespace "aut-pipelines-overview"
+              And user is at pipelines overview page
+
+        @pre-condition
+        Scenario: Background Steps
+              And user clicks on Pipelines Tab
+              And pipeline named "pipe-one" is available with pipeline run
+
+
+        @smoke
+        Scenario: Pipeline Overview page: P-13-TC01
+             When user selects "aut-pipelines-overview" in Project dropdown
+              And user selects "Last weeks" in Time Range
+              And user selects "5 minute" in Refresh Interval
+             Then user can see PipelineRun status, Duration, Total runs, Number of PipelineRuns charts
+
+
+        @regression
+        Scenario: Pipeline details page from overview page task runs: P-13-TC02
+             When user selects "aut-pipelines-overview" in Project dropdown
+             When user clicks on Pipeline "pipe-one" in pipeline overview table
+             Then user will be redirected to Pipeline Details page with header name "pipe-one"
+
+
+        @regression
+        Scenario: Pipeline run details page from overview page task runs: P-13-TC02
+             When user selects "aut-pipelines-overview" in Project dropdown
+             When user clicks on Total Pipelineruns number of "pipe-one" in pipeline overview table
+             Then user will be redirected to Pipeline Details page with pipeline run tab

integration-tests/cypress/support/pages/functions/installOperatorOnClusterUsingCLI.ts

@@ -10,6 +10,7 @@ import {
   checkKnativeOperatorStatus,
   checkPipelineOperatorStatus,
 } from './checkOperatorStatus';
+import { waitForDynamicPlugin } from './installOperatorOnCluster';
 import {
   createKnativeEventingUsingCLI,
   createKnativeKafkaUsingCLI,
@@ -34,6 +35,7 @@ export const performPostInstallationSteps = (operator: operators): void => {
   switch (operator) {
     case operators.PipelinesOperator:
       checkPipelineOperatorStatus();
+      waitForDynamicPlugin();
       break;
     case operators.ServerlessOperator:
       cy.wait(40000);

integration-tests/cypress/support/pages/pipelines/task-page.ts

@@ -36,9 +36,12 @@ export const tasksPage = {
       .click({ force: true });
   },
   clickOnCreatePipeline: () => {
-    cy.get('[data-test-id="dropdown-button"]')
+    cy.get('[data-test="item-create"]')
       .contains('Create')
       .click({ force: true });
-    cy.byTestDropDownMenu('pipeline').click();
+    // cy.byTestDropDownMenu('pipeline').click();
+    cy.get(
+      '[data-test="list-page-create-dropdown-item-pipeline"] button',
+    ).click();
   },
 };

integration-tests/cypress/support/step-definitions/pipelines/pipeline-overview.ts

@@ -0,0 +1,160 @@
+/* eslint-disable cypress/no-unnecessary-waiting */
+import { Given, Then, When } from '@badeball/cypress-cucumber-preprocessor';
+import { switchPerspective } from '../../constants/global';
+import {
+  pipelineBuilderPO,
+  pipelineDetailsPO,
+} from '../../page-objects/pipelines-po';
+import { pipelineDetailsPage, pipelineRunDetailsPage } from '../../pages';
+import { perspective } from '../../pages/app';
+import { actionsDropdownMenu } from '../../pages/functions/common';
+import { tasksPage } from '../../pages/pipelines/task-page';
+
+Given('user is at Administrator perspective', () => {
+  perspective.switchTo(switchPerspective.Administrator);
+});
+
+Given('user selects {string} in Project dropdown', (projectName: string) => {
+  cy.get('[class="project-dropdown-label"]')
+    .parent()
+    .within(($el) => {
+      cy.get('[class$="menu-toggle"]').click();
+      cy.get('[class*="pipeline-overview__variable-dropdown"]').should(
+        'be.visible',
+      );
+      cy.get('[role="menuitem"]').contains(projectName).click();
+      cy.get('[class$="menu-toggle"]').should('contain.text', projectName);
+    });
+});
+
+When('user selects {string} in Time Range', (range: string) => {
+  cy.get('[class="form-group"]')
+    .contains('Time Range')
+    .parent()
+    .within(($el) => {
+      cy.get('[class$="menu-toggle"]').click();
+      cy.get('[class*="pipeline-overview__variable-dropdown"]').should(
+        'be.visible',
+      );
+      cy.get('[role="menuitem"]').contains(range).click();
+      cy.get('[class$="menu-toggle"]').should('contain.text', range);
+    });
+});
+
+When('user selects {string} in Refresh Interval', (interval: string) => {
+  cy.get('[class="form-group"]')
+    .contains('Refresh Interval')
+    .parent()
+    .within(($el) => {
+      cy.get('[class*="pipeline-overview__dropdown-button"]').click();
+      cy.get('[class*="pipeline-overview__variable-dropdown"]').should(
+        'be.visible',
+      );
+      cy.get('[role="menuitem"]').contains(interval).click();
+      cy.get('[class*="pipeline-overview__dropdown-button"]').should(
+        'contain.text',
+        interval,
+      );
+    });
+});
+
+When(
+  'user can see PipelineRun status, Duration, Total runs, Number of PipelineRuns charts',
+  () => {
+    // eslint-disable-next-line cypress/unsafe-to-chain-command
+    cy.get('[class*="pipeline-overview__pipelinerun-status-card__title"]')
+      .contains('PipelineRun status')
+      .scrollIntoView()
+      .should('be.visible');
+    cy.get('[class*="pipelines-overview__cards"]')
+      .contains('Duration')
+      .should('be.visible');
+    cy.get('[class*="pipelines-overview__cards"]')
+      .contains('Total runs')
+      .should('be.visible');
+    cy.get('[class*="pipelines-overview__cards"]')
+      .contains('Number of PipelineRuns')
+      .should('be.visible');
+  },
+);
+
+When(
+  'user clicks on Pipeline {string} in pipeline overview table',
+  (name: string) => {
+    // eslint-disable-next-line cypress/unsafe-to-chain-command
+    cy.get('input[aria-label="Search input"]').focus().clear().type(name);
+    cy.wait(5000);
+    cy.get(`[data-test="${name}"]`).click();
+  },
+);
+
+When(
+  'user clicks on Total Pipelineruns number of {string} in pipeline overview table',
+  (value: string) => {
+    // eslint-disable-next-line cypress/unsafe-to-chain-command
+    cy.get('input[aria-label="Search input"]').focus().clear().type(value);
+    cy.wait(5000);
+    // pipelinesPage.search(value);
+    cy.get('tr[data-test-rows="resource-row"] td>a').click({ force: true });
+  },
+);
+
+Then(
+  'user will be redirected to Pipeline Details page with header name {string}',
+  (pipelineName: string) => {
+    pipelineDetailsPage.verifyTitle(pipelineName);
+  },
+);
+
+Then('page will be redirected to pipeline Run details page', () => {
+  pipelineRunDetailsPage.verifyTitle();
+});
+
+Then(
+  'user will be redirected to Pipeline Details page with pipeline run tab',
+  () => {
+    cy.get(pipelineDetailsPO.pipelineRunsTab).should('be.visible');
+    cy.url().should('include', 'Runs');
+  },
+);
+
+When(
+  'pipeline named {string} is available with pipeline run',
+  (pipelineName: string) => {
+    tasksPage.togglePipelineSidebar();
+    tasksPage.openPipelinePage();
+    tasksPage.togglePipelineSidebar();
+    tasksPage.clickOnCreatePipeline();
+    cy.get(pipelineBuilderPO.formView.switchToFormView).click();
+    /* eslint-disable-next-line cypress/unsafe-to-chain-command */
+    cy.get(pipelineBuilderPO.formView.name).clear().type(pipelineName);
+    cy.byTestID('task-list').click();
+    cy.get(pipelineBuilderPO.formView.quickSearch).type('kn');
+    cy.byTestID('task-cta').click();
+    cy.get(pipelineBuilderPO.create).click();
+    actionsDropdownMenu.selectAction('Start');
+    cy.get('[data-test="breadcrumb-link"]').click();
+  },
+);
+
+When('user clicks on Pipelines Tab', () => {
+  cy.get('[data-test="nav-pipelines"]').then(($el) => {
+    if ($el.attr('aria-expanded') === 'false') {
+      cy.wrap($el).click();
+    }
+  });
+  cy.get('[data-test="nav"][data-quickstart-id="qs-nav-pipelines"]')
+    .contains('Pipelines')
+    .click();
+});
+
+Given('user is at pipelines overview page', () => {
+  cy.get('[data-test="nav-pipelines"]').then(($el) => {
+    if ($el.attr('aria-expanded') === 'false') {
+      cy.wrap($el).click();
+    }
+  });
+  cy.get('[data-test="nav"][href*="pipelines-overview"]')
+    .contains('Overview')
+    .click({ force: true });
+});

package.json

@@ -15,7 +15,7 @@
     "lint": "eslint ./src ./integration-tests --fix &&  stylelint \"src/**/*.css\" --allow-empty-input --fix",
     "gherkin-lint": "./node_modules/.bin/gherkin-lint -c ./integration-tests/.gherkin-lintrc ./integration-tests/features",
     "test-cypress": "cd integration-tests && cypress open --env openshift=true",
-    "test-cypress-headless": "cd integration-tests && node --max-old-space-size=4096 ../node_modules/.bin/cypress run --env openshift=true --browser ${BRIDGE_E2E_BROWSER_NAME:=electron} --headless cypress:cli,cypress:server:specs --spec \"cypress/features/pipelines/create-from-add-options.feature\"",
+    "test-cypress-headless": "cd integration-tests && node --max-old-space-size=4096 ../node_modules/.bin/cypress run --env openshift=true --browser ${BRIDGE_E2E_BROWSER_NAME:=electron} --headless cypress:cli,cypress:server:specs --spec \"cypress/features/pipelines/create-from-add-options.feature\" \"cypress/features/pipelines/pipeline-overview.feature\"",
     "cypress-merge": "mochawesome-merge ./integration-tests/screenshots/cypress_report*.json > ./integration-tests/screenshots/cypress.json",
     "cypress-generate": "marge -o ./integration-tests/screenshots/ -f cypress-report -t 'OpenShift Console Plugin Template Cypress Test Results' -p 'OpenShift Cypress Plugin Template Test Results' --showPassed false --assetsDir ./integration-tests/screenshots/cypress/assets ./integration-tests/screenshots/cypress.json",
     "cypress-postreport": "yarn cypress-merge && yarn cypress-generate",