chore: update auth examples to use cy.task instead of Cypress.env() (#1673)

Author: AtofStryker

cypress.config.ts

@@ -35,28 +35,20 @@ export default defineConfig({
     paginationPageSize: process.env.PAGINATION_PAGE_SIZE,
 
     // Auth0
-    auth0_username: process.env.AUTH0_USERNAME,
-    auth0_password: process.env.AUTH0_PASSWORD,
     auth0_domain: process.env.VITE_AUTH0_DOMAIN,
 
     // Okta
-    okta_username: process.env.OKTA_USERNAME,
-    okta_password: process.env.OKTA_PASSWORD,
     okta_domain: process.env.VITE_OKTA_DOMAIN,
     okta_client_id: process.env.VITE_OKTA_CLIENTID,
     okta_programmatic_login: process.env.OKTA_PROGRAMMATIC_LOGIN || false,
 
     // Amazon Cognito
-    cognito_username: process.env.AWS_COGNITO_USERNAME,
-    cognito_password: process.env.AWS_COGNITO_PASSWORD,
     cognito_domain: process.env.AWS_COGNITO_DOMAIN,
     cognito_programmatic_login: false,
     awsConfig: awsConfig.default,
 
     // Google
-    googleRefreshToken: process.env.GOOGLE_REFRESH_TOKEN,
     googleClientId: process.env.VITE_GOOGLE_CLIENTID,
-    googleClientSecret: process.env.VITE_GOOGLE_CLIENT_SECRET,
   },
   component: {
     devServer: {
@@ -105,6 +97,38 @@ export default defineConfig({
         "find:database"(queryPayload) {
           return queryDatabase(queryPayload, (data, attrs) => _.find(data.results, attrs));
         },
+        getAuth0Credentials() {
+          const username = process.env.AUTH0_USERNAME;
+          const password = process.env.AUTH0_PASSWORD;
+          if (!username || !password) {
+            throw new Error("AUTH0_USERNAME and AUTH0_PASSWORD must be set");
+          }
+          return { username, password };
+        },
+        getOktaCredentials() {
+          const username = process.env.OKTA_USERNAME;
+          const password = process.env.OKTA_PASSWORD;
+          if (!username || !password) {
+            throw new Error("OKTA_USERNAME and OKTA_PASSWORD must be set");
+          }
+          return { username, password };
+        },
+        getCognitoCredentials() {
+          const username = process.env.AWS_COGNITO_USERNAME;
+          const password = process.env.AWS_COGNITO_PASSWORD;
+          if (!username || !password) {
+            throw new Error("AWS_COGNITO_USERNAME and AWS_COGNITO_PASSWORD must be set");
+          }
+          return { username, password };
+        },
+        getGoogleCredentials() {
+          const refreshToken = process.env.GOOGLE_REFRESH_TOKEN;
+          const clientSecret = process.env.VITE_GOOGLE_CLIENT_SECRET;
+          if (!refreshToken || !clientSecret) {
+            throw new Error("GOOGLE_REFRESH_TOKEN and VITE_GOOGLE_CLIENT_SECRET must be set");
+          }
+          return { refreshToken, clientSecret };
+        },
       });
 
       codeCoverageTask(on, config);

cypress/support/commands.ts

@@ -351,38 +351,42 @@ Cypress.Commands.add("database", (operation, entity, query, logTask = false) =>
 Cypress.Commands.add("loginByGoogleApi", () => {
   cy.log("Logging in to Google");
 
-  cy.request({
-    method: "POST",
-    url: "https://www.googleapis.com/oauth2/v4/token",
-    body: {
-      grant_type: "refresh_token",
-      client_id: Cypress.env("googleClientId"),
-      client_secret: Cypress.env("googleClientSecret"),
-      refresh_token: Cypress.env("googleRefreshToken"),
-    },
-  }).then(({ body }) => {
-    const { access_token, id_token } = body;
-
-    cy.request({
-      method: "GET",
-      url: "https://www.googleapis.com/oauth2/v3/userinfo",
-      headers: { Authorization: `Bearer ${access_token}` },
-    }).then(({ body }) => {
-      cy.log(body);
-      const userItem = {
-        token: id_token,
-        user: {
-          googleId: body.sub,
-          email: body.email,
-          givenName: body.given_name,
-          familyName: body.family_name,
-          imageUrl: body.picture,
+  cy.task<{ clientSecret: string; refreshToken: string }>("getGoogleCredentials").then(
+    ({ clientSecret, refreshToken }) => {
+      cy.request({
+        method: "POST",
+        url: "https://www.googleapis.com/oauth2/v4/token",
+        body: {
+          grant_type: "refresh_token",
+          client_id: Cypress.env("googleClientId"),
+          client_secret: clientSecret,
+          refresh_token: refreshToken,
         },
-      };
-
-      window.localStorage.setItem("googleCypress", JSON.stringify(userItem));
-
-      cy.visit("/");
-    });
-  });
+      }).then(({ body }) => {
+        const { access_token, id_token } = body;
+
+        cy.request({
+          method: "GET",
+          url: "https://www.googleapis.com/oauth2/v3/userinfo",
+          headers: { Authorization: `Bearer ${access_token}` },
+        }).then(({ body }) => {
+          cy.log(body);
+          const userItem = {
+            token: id_token,
+            user: {
+              googleId: body.sub,
+              email: body.email,
+              givenName: body.given_name,
+              familyName: body.family_name,
+              imageUrl: body.picture,
+            },
+          };
+
+          window.localStorage.setItem("googleCypress", JSON.stringify(userItem));
+
+          cy.visit("/");
+        });
+      });
+    }
+  );
 });

cypress/tests/ui-auth-providers/auth0.spec.ts

@@ -5,7 +5,11 @@ if (Cypress.env("auth0_username")) {
     beforeEach(function () {
       cy.task("db:seed");
       cy.intercept("POST", "/graphql").as("createBankAccount");
-      cy.loginToAuth0(Cypress.env("auth0_username"), Cypress.env("auth0_password"));
+      cy.task<{ username: string; password: string }>("getAuth0Credentials").then(
+        ({ username, password }) => {
+          cy.loginToAuth0(username, password);
+        }
+      );
       cy.visit("/");
     });
 

cypress/tests/ui-auth-providers/cognito.spec.ts

@@ -11,7 +11,11 @@ if (Cypress.env("cognito_username")) {
 
         cy.intercept("POST", apiGraphQL).as("createBankAccount");
 
-        cy.loginByCognitoApi(Cypress.env("cognito_username"), Cypress.env("cognito_password"));
+        cy.task<{ username: string; password: string }>("getCognitoCredentials").then(
+          ({ username, password }) => {
+            cy.loginByCognitoApi(username, password);
+          }
+        );
       });
 
       it("should allow a visitor to login, onboard and logout", function () {

cypress/tests/ui-auth-providers/okta.spec.ts

@@ -8,7 +8,11 @@ if (Cypress.env("okta_username")) {
 
         cy.intercept("POST", "/bankAccounts").as("createBankAccount");
 
-        cy.loginByOktaApi(Cypress.env("okta_username"), Cypress.env("okta_password"));
+        cy.task<{ username: string; password: string }>("getOktaCredentials").then(
+          ({ username, password }) => {
+            cy.loginByOktaApi(username, password);
+          }
+        );
       });
 
       it("should allow a visitor to login, onboard and logout", function () {