test: added e2e tests for get credentials

.github/workflows/e2e-tests.yml

@@ -18,17 +18,31 @@ on:
       - "cypress/**"
 jobs:
   smoke_tests:
-    runs-on: ubuntu-latest
+    container:
+      image: cypress/browsers:node-20.14.0-chrome-126.0.6478.114-1-ff-127.0.1-edge-126.0.2592.61-1
+      options: --user root
+    runs-on: self-hosted
     steps:
       - name: Checkout
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
+
+      - name: 'Create env file'
+        run: |
+          touch ./example/.env
+          echo GATSBY_IMS_SRC="https://auth-stg1.services.adobe.com/imslib/imslib.min.js" >> ./example/.env
+          echo GATSBY_IMS_CONFIG='{"client_id": "stage_adobe_io", "scope": "AdobeID,openid,unified_dev_portal,read_organizations,additional_info.projectedProductContext,additional_info.roles,gnav,read_pc.dma_bullseye,creative_sdk,adobeio_api,service_principals.read,service_principals.write,read_client_secret", "environment": "stg1"}' >> ./example/.env
+          cat ./example/.env
 
       - name: Run Tests
         uses: cypress-io/github-action@v5
         with:
-          build: yarn build
-          start: yarn serve
-          wait-on: 'http://[::1]:9000'
+          start: yarn dev:https:ci
+          wait-on: 'https://localhost.corp.adobe.com:9000'
+          wait-on-timeout: 150
           browser: chrome
           config-file: cypress.config.js
-          spec: cypress/e2e/smoke.cy.js
+          spec: |
+            cypress/e2e/smoke.cy.js
+            cypress/e2e/get-credentials.cy.js
+        env:
+          NODE_TLS_REJECT_UNAUTHORIZED: '0'

cypress.config.js

@@ -1,16 +1,21 @@
-const { defineConfig } = require('cypress')
-
-module.exports = defineConfig({
-  viewportHeight: 900,
-  viewportWidth: 1440,
-  e2e: {
-    // We've imported your old cypress plugins here.
-    // You may want to clean this up later by importing these.
-    setupNodeEvents(on, config) {
-      return require('./cypress/plugins/index.js')(on, config)
-    },
-    baseUrl: 'http://localhost:9000',
-    specPattern: 'cypress/e2e/**/*.cy.{js,jsx,ts,tsx}',
-  },
-  pageLoadTimeout: 500000,
-})
+const { defineConfig } = require('cypress')
+
+module.exports = defineConfig({
+  viewportHeight: 900,
+  viewportWidth: 1440,
+  e2e: {
+    // We've imported your old cypress plugins here.
+    // You may want to clean this up later by importing these.
+    setupNodeEvents(on, config) {
+      return require('./cypress/plugins/index.js')(on, config)
+    },
+    baseUrl: 'https://localhost.corp.adobe.com:9000',
+    specPattern: 'cypress/e2e/**/*.cy.{js,jsx,ts,tsx}',
+  },
+  pageLoadTimeout: 500000,
+  userEmail: 'cypress1@adobe.com',
+  userPassword: 'ScotchB33r&1234567',
+  defaultCommandTimeout: 60000,
+  video: false,
+  chromeWebSecurity: false
+})

cypress/e2e/get-credentials.cy.js

@@ -0,0 +1,162 @@
+const API_KEY = 'apikey';
+const OAUTH_S2S = 'oauths2s';
+
+function init(route) {
+  cy.visit(route).assertRoute(route);
+  cy.expect('button[data-cy="sign-in-btn"]').to.exist;
+  cy.get('button[data-cy="sign-in-btn"]').should('be.visible');
+  cy.get('button[data-cy="sign-in-btn"]').should('be.enabled');
+  cy.get('button[data-cy="sign-in-btn"]').click();
+  cy.login();
+  cy.get('button[data-cy="sign-in-btn"]').should('not.exist');
+  cy.assertRoute(route + '#');
+}
+
+function checkRequestAccessEdgeCase() {
+  cy.get('button[data-cy="accessDetails-edgeCase-btn"]').should('be.visible').should('be.enabled');
+};
+
+function getIframeBody() {
+  return cy.get('iframe[data-cy="request-access-iframe"]')
+  .its('0.contentDocument.body').should('not.be.empty')
+  .then(cy.wrap);
+}
+
+function checkRequestAccess() {
+  cy.get('body').then(($body) => {
+    // if the request is not already sent, send the request
+    if ($body.find('[data-cy="request-access-button"]').length > 0) {
+      cy.get('[data-cy="request-access-button"]').click();
+      getIframeBody().find('button[data-testid="send-request-button"]').should('exist').click();
+      getIframeBody().find('button[data-testid="close-button"]').should('exist').click();
+    }
+  });
+  cy.get('button[data-cy="request-info"]').should('be.visible').should('be.enabled').click();
+  cy.get('body', { timeout: 1000 }).click();
+};
+
+function checkReturnFlow(credentialType) {
+  // verify return flow is visible
+  cy.get('[data-cy="return-flow"]').should('be.visible');
+
+  // verify clicking on create new credential button opens the form
+  returnToForm();
+
+  // verify clicking on cancel button closes the form
+  cy.get('[data-cy="cancel-new-credential"]').click();
+  cy.get('[data-cy="return-flow"]').should('be.visible');
+
+  // verify clicking on manage projects console button exists
+  cy.get('[data-cy="manage-projects-console"]').should('exist');
+
+  // ensure project picker is visible
+  cy.get('button[data-cy="projects-picker"]').should('be.visible').should('be.enabled');
+
+  // verify all the information is visible based on credential type
+  checkCredential(credentialType);
+};
+
+function checkAPIKey() {
+  // verify API key is visible
+  cy.contains('API Key').should('be.visible');
+
+  // verify API key copy button is clickable
+  cy.get('[data-cy="API Key-copyIcon"]').should('be.visible');
+
+  // verify allowed domains copy button is clickable
+  cy.get('[data-cy="Allowed domains-copyIcon"]').should('be.visible');
+}
+
+function checkOAuthS2S() {
+  cy.get('button[data-cy="generate-token"]').should('be.visible').should('be.enabled');
+  // cy.get('button[data-cy="copy-token"]').should('exist');
+  cy.get('[data-cy="credentialName-link"]').should('exist');
+  cy.get('button[data-cy="ClientId-copyIcon"]').should('exist');
+  cy.get('button[data-cy="retrieve-client-secret"]').should('be.visible').should('be.enabled');
+  // cy.get('button[data-cy="copy-client-secret"]').should('exist');
+  cy.get('button[data-cy="Scopes-copyIcon"]').should('exist');
+  cy.contains('openid, AdobeID, read_organizations, firefly_api, ff_apis').should('exist');
+}
+
+function checkCredential(credentialType) {
+  switch(credentialType) {
+    case API_KEY:
+      checkAPIKey();
+      break;
+    case OAUTH_S2S:
+      checkOAuthS2S();
+      break;
+  }
+
+  cy.get('[data-cy="next-step-button"]').should('exist');
+  if (credentialType !== API_KEY) {
+    cy.get('[data-cy="Manage-Dev-Console-link"]').should('exist');
+  }
+};
+
+function addCredential(credentialType) {
+  const credentialName = `CypressTest${credentialType}${Math.floor(Math.random() * 1000)}`;
+  cy.get('[data-cy="add-credential-name"]').click().should('have.focus');
+  cy.get('[data-cy="add-credential-name"]').type(credentialName).should('have.value', credentialName);
+  if (credentialType === API_KEY) {
+    cy.get('[data-cy="add-allowed-origins"]').click().should('have.focus');
+    cy.get('[data-cy="add-allowed-origins"]').type('localhost:9000').should('have.value', 'localhost:9000');
+    cy.get('[data-cy="download-checkBox"]').check().should('be.checked');
+    cy.get('[data-cy="select-download-language"]').click();
+    cy.get('ul li').contains('JavaScript').click();
+  }
+  cy.get('[data-cy="terms-condition-link"]').should('be.visible');
+  cy.get('[data-cy="update-terms-condition"]').check().should('be.checked');
+  cy.get('[data-cy="create-credential-btn"]').should('be.visible');
+  cy.get('[data-cy="create-credential-btn"]').should('be.enabled');
+  cy.get('[data-cy="create-credential-btn"]').click();
+  if (credentialType === API_KEY) {
+    cy.get('button[data-cy="restart-download"]').should('be.visible').should('be.enabled').click();
+  }
+  checkCredential(credentialType);
+  cy.get('[data-cy="Restart-new-credential"]').click();
+};
+
+function waitForLoader() {
+  cy.get('div[data-cy="loader"]').should('exist');
+  cy.get('div[data-cy="loader"]').should('not.exist');
+
+}
+
+function selectOrganization(orgName) {
+  cy.get('button[data-cy="change-organization-btn"]').should('be.visible').should('be.enabled').click();
+  cy.get('button[data-cy="organization-picker"]').should('be.visible').should('be.enabled').click();
+  cy.contains(orgName).should('exist').click();
+  cy.get('button[data-cy="submit-change-organization"]').should('be.visible').should('be.enabled').click();
+  waitForLoader();
+};
+
+function returnToForm() {
+  cy.get('[data-cy="create-new-credential"]').should('be.visible');
+  cy.get('[data-cy="create-new-credential"]').click();
+  cy.get('[data-cy="credential-form"]').should('be.visible');
+}
+
+describe('Get Credentials Test', () => {
+  it('API Key page loads', () => {
+    init('/getCredential/');
+    checkReturnFlow(API_KEY);
+    selectOrganization('AdobeIOTestingOrg');
+    checkReturnFlow(API_KEY);
+    // return to the form
+    returnToForm();
+    addCredential(API_KEY);
+  });
+
+  it('OAuth s2s page loads', () => {
+    init('/get-credential-oauth/');
+    checkRequestAccessEdgeCase();
+    selectOrganization('Romans entp org');
+    checkRequestAccess();
+    selectOrganization('MAC New Feature Testing');
+    checkReturnFlow(OAUTH_S2S);
+    // return to the form
+    returnToForm();
+    addCredential(OAUTH_S2S);
+  });
+});