frontend: e2e tests

This is a stacked PR #6:
data-pipelines e2e tests.

End-to-end tests sources added.

Testing done: fetched the `frontend/shared-components` changes
(from person/mdilyan/os-shared-components feature branch in review),
and verified `frontend/data-pipelines` manual start + unit + e2e tests.

Signed-off-by: ivakoleva <[email protected]>

projects/frontend/data-pipelines/gui/e2e/fixtures/e2e-cy-dp-failing.job.json

@@ -0,0 +1,19 @@
+{
+  "job_name": "e2e-cp-$env-placeholder$-failing-job",
+  "description": "Testing failing job, that is used in data-pipelines CI/CD for UI e2e tests. It is intended to be always available in order to speed up deployment and if deleted will be automatically re-created by the e2e tests.",
+  "config": {
+    "db_default_type": "IMPALA",
+    "contacts": {
+      "notified_on_job_failure_user_error": [],
+      "notified_on_job_failure_platform_error": [],
+      "notified_on_job_success": [],
+      "notified_on_job_deploy": []
+    },
+    "schedule": {
+      "schedule_cron": "0 */12 * * *"
+    },
+    "generate_keytab": true,
+    "enable_execution_notifications": true
+  },
+  "team": "supercollider"
+}

projects/frontend/data-pipelines/gui/e2e/fixtures/lib/explore/additional-test-job.json

@@ -0,0 +1,27 @@
+{
+  "config": {
+    "contacts": {
+      "notified_on_job_deploy": [
+        "[email protected]"
+      ],
+      "notified_on_job_failure_platform_error": [
+        "[email protected]"
+      ],
+      "notified_on_job_failure_user_error": [
+        "[email protected]"
+      ],
+      "notified_on_job_success": [
+        "[email protected]"
+      ]
+    },
+    "db_default_type": "IMPALA",
+    "generate_keytab": false,
+    "schedule": {
+      "schedule_cron": "0 0 03 * 5"
+    }
+  },
+  "description": "Test description 3 with a long text on the line",
+  "job_name": "e2e-cp-$env-placeholder$-a-test-job-3",
+  "status": "disabled",
+  "team": "e2e-cp-$env-placeholder$-a-test-team-3"
+}

projects/frontend/data-pipelines/gui/e2e/fixtures/lib/explore/test-jobs.json

@@ -0,0 +1,56 @@
+[
+  {
+    "config": {
+      "contacts": {
+        "notified_on_job_deploy": [
+          "[email protected]"
+        ],
+        "notified_on_job_failure_platform_error": [
+          "[email protected]"
+        ],
+        "notified_on_job_failure_user_error": [
+          "[email protected]"
+        ],
+        "notified_on_job_success": [
+          "[email protected]"
+        ]
+      },
+      "db_default_type": "IMPALA",
+      "generate_keytab": false,
+      "schedule": {
+        "schedule_cron": "0 0 01 * 5"
+      }
+    },
+    "description": "Test description 1 with a long text on the line",
+    "job_name": "e2e-cp-$env-placeholder$-a-test-job-1",
+    "status": "disabled",
+    "team": "e2e-cp-$env-placeholder$-a-test-team-1"
+  },
+  {
+    "config": {
+      "contacts": {
+        "notified_on_job_deploy": [
+          "[email protected]"
+        ],
+        "notified_on_job_failure_platform_error": [
+          "[email protected]"
+        ],
+        "notified_on_job_failure_user_error": [
+          "[email protected]"
+        ],
+        "notified_on_job_success": [
+          "[email protected]"
+        ]
+      },
+      "db_default_type": "IMPALA",
+      "generate_keytab": false,
+      "schedule": {
+        "schedule_cron": "0 0 02 * 5"
+      }
+    },
+    "description": "Test description 2 with a long text on the line",
+    "job_name": "e2e-cp-$env-placeholder$-a-test-job-2",
+    "status": "disabled",
+    "team": "e2e-cp-$env-placeholder$-a-test-team-2"
+  }
+]

projects/frontend/data-pipelines/gui/e2e/fixtures/lib/manage/e2e-cypress-dp-test.json

@@ -0,0 +1,19 @@
+{
+  "job_name": "e2e-cp-$env-placeholder$-test-job",
+  "description": "Testing job, that is used in data-pipelines CI/CD for UI e2e tests. It is intended to be always available in order to speed up deployment and if deleted will be automatically re-created by the e2e tests." ,
+  "config": {
+    "db_default_type": "IMPALA" ,
+    "contacts": {
+      "notified_on_job_failure_user_error": [] ,
+      "notified_on_job_failure_platform_error": [] ,
+      "notified_on_job_success": [] ,
+      "notified_on_job_deploy": []
+    } ,
+    "schedule": {
+      "schedule_cron": "11 23 5 8 1"
+    } ,
+    "generate_keytab": true ,
+    "enable_execution_notifications": true
+  } ,
+  "team": "supercollider"
+}

projects/frontend/data-pipelines/gui/e2e/integration/app/app.spec.js

@@ -0,0 +1,38 @@
+/*
+ * Copyright 2021 VMware, Inc.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/// <reference types="cypress" />
+
+import { AppPage } from '../../support/pages/app/app.po';
+
+describe('App Page', { tags: ['@dataPipelines'] }, () => {
+    before(() => {
+        return AppPage.recordHarIfSupported()
+                      .then(() => cy.clearLocalStorageSnapshot('app'))
+                      .then(() => AppPage.login())
+                      .then(() => cy.saveLocalStorage('app'));
+    });
+
+    after(() => {
+        AppPage.saveHarIfSupported();
+    });
+
+    beforeEach(() => {
+        cy.restoreLocalStorage('app');
+    });
+
+    it('App Page - Main Title Component have text: Data Pipelines', () => {
+        AppPage.navigateTo();
+
+        const page = AppPage.getPage();
+
+        page
+            .waitForInitialPageLoad();
+
+        page
+            .getMainTitle()
+            .should('have.text', 'Data Pipelines');
+    });
+});

projects/frontend/data-pipelines/gui/e2e/integration/app/getting-started/getting-started.spec.js

@@ -0,0 +1,144 @@
+/*
+ * Copyright 2021 VMware, Inc.
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/// <reference types="cypress" />
+import { DataPipelinesBasePO } from '../../../support/application/data-pipelines-base.po';
+import { GettingStartedPage } from '../../../support/pages/app/getting-started/getting-started.po';
+import { DataJobsHealthPanelComponentPO } from '../../../support/pages/app/getting-started/data-jobs-health-panel-component.po';
+import { DataJobManageDetailsPage } from '../../../support/pages/app/lib/manage/data-job-details.po';
+import { DataJobManageExecutionsPage } from '../../../support/pages/app/lib/manage/data-job-executions.po';
+import { applyGlobalEnvSettings } from '../../../support/helpers/commands.helpers';
+
+describe('Getting Started Page', { tags: ['@dataPipelines'] }, () => {
+    let testJob;
+
+    before(() => {
+        return DataPipelinesBasePO.recordHarIfSupported()
+                                  .then(() => cy.clearLocalStorageSnapshot('getting-started'))
+                                  .then(() => DataPipelinesBasePO.login())
+                                  .then(() => cy.saveLocalStorage('getting-started'))
+                                  .then(() => cy.prepareLongLivedFailingTestJob())
+                                  .then(() => cy.createExecutionsLongLivedFailingTestJob())
+                                  .then(() => cy.fixture('e2e-cy-dp-failing.job.json'))
+                                  .then((failingTestJob) => {
+                                      testJob = applyGlobalEnvSettings(failingTestJob);
+
+                                      return cy.wrap({ context: 'getting-started.spec::before()', action: 'continue' });
+                                  });
+    });
+
+    after(() => {
+        DataPipelinesBasePO.saveHarIfSupported();
+    });
+
+    beforeEach(() => {
+        cy.restoreLocalStorage('getting-started');
+
+        DataPipelinesBasePO.initBackendRequestInterceptor();
+    });
+
+    it('Main Title Component have text: Get Started with Data Pipelines', () => {
+        GettingStartedPage
+            .navigateTo()
+            .getMainTitle()
+            //TODO : Discuss/agree what should be the assertion strategy of the UI Components.
+            // Do we assert text directly, or use some other form?
+            .should('have.text', 'Get Started with Data Pipelines');
+    });
+
+    describe('Data Jobs Health Overview Panel', () => {
+        it('Verify Widgets rendered correct data and failing jobs navigates correctly', () => {
+            GettingStartedPage
+                .navigateTo();
+
+            let dataJobsHealthPanel = DataJobsHealthPanelComponentPO
+                .getComponent();
+            dataJobsHealthPanel
+                .waitForViewToRender();
+            dataJobsHealthPanel
+                .getDataJobsHealthPanel()
+                .scrollIntoView();
+
+            dataJobsHealthPanel
+                .getExecutionsSuccessPercentage()
+                .should('be.gte', 0)
+                .should('be.lte', 100);
+            dataJobsHealthPanel
+                .getNumberOfFailedExecutions()
+                .should('be.gte', 2);
+            dataJobsHealthPanel
+                .getExecutionsTotal()
+                .should('be.gte', 2);
+
+            dataJobsHealthPanel
+                .getAllFailingJobs()
+                .should('have.length.gte', 1);
+
+            dataJobsHealthPanel
+                .getAllMostRecentFailingJobsExecutions()
+                .should('have.length.gte', 1);
+
+            // navigate to failing job details
+            dataJobsHealthPanel
+                .navigateToFailingJobDetails(testJob.job_name);
+
+            const dataJobManageDetailsPage = DataJobManageDetailsPage
+                .getPage();
+            dataJobManageDetailsPage
+                .getMainTitle()
+                .should('contain.text', testJob.job_name);
+            dataJobManageDetailsPage
+                .getDetailsTab()
+                .should('be.visible')
+                .should('have.class', 'active');
+            dataJobManageDetailsPage
+                .getExecutionsTab()
+                .should('exist')
+                .should('not.have.class', 'active');
+            dataJobManageDetailsPage
+                .showMoreDescription()
+                .getDescriptionFull()
+                .should('contain.text', testJob.description);
+        });
+
+        it('Verify most recent failing executions Widget navigates correctly', () => {
+            GettingStartedPage
+                .navigateTo();
+
+            let dataJobsHealthPanel = DataJobsHealthPanelComponentPO
+                .getComponent();
+            dataJobsHealthPanel
+                .waitForViewToRender();
+            dataJobsHealthPanel
+                .getDataJobsHealthPanel()
+                .scrollIntoView();
+
+            dataJobsHealthPanel
+                .getAllMostRecentFailingJobsExecutions()
+                .should('have.length.gte', 1);
+
+            // navigate to most recent failing job executions
+            dataJobsHealthPanel
+                .navigateToMostRecentFailingJobExecutions(testJob.job_name);
+
+            const dataJobManageExecutionsPage = DataJobManageExecutionsPage
+                .getPage();
+            dataJobManageExecutionsPage
+                .getMainTitle()
+                .should('contain.text', testJob.job_name);
+            dataJobManageExecutionsPage
+                .getDetailsTab()
+                .should('be.visible')
+                .should('not.have.class', 'active');
+            dataJobManageExecutionsPage
+                .getExecutionsTab()
+                .should('be.visible')
+                .should('have.class', 'active');
+            dataJobManageExecutionsPage
+                .getDataGridRows()
+                .should('have.length.gte', 1);
+        });
+    });
+});