Merge foundation branch and combine login methods

Signed-off-by: Triona Doyle <bot@example.com>

Author: Triona Doyle

test/ui-e2e/.auth/setup.ts

@@ -3,24 +3,23 @@ import { test as setup } from '@playwright/test';
 const authFile = '.auth/storageState.json';
 
 setup('authenticate to OpenShift Cluster', async ({ page, baseURL }) => {
-  // 1. Navigate to the OpenShift Console
-  // It checks Playwright's config (baseURL) first, then falls back to environment variables
+  // Navigate to the OpenShift Console
   const targetUrl = baseURL || process.env.CONSOLE_URL || process.env.BASE_URL;
 
   if (!targetUrl) {
     throw new Error("No Console URL provided! Ensure your bash script exports BASE_URL or CONSOLE_URL.");
   }
 
   console.log(`Navigating to OpenShift Console: ${targetUrl}`);
-  await page.goto(targetUrl); // <-- THIS WAS THE MISSING LINK!
+  await page.goto(targetUrl); 
 
-  // 2. Define our locators flexibly
+  //set locators 
   const idpScreenText = page.getByText(/Log in with/i);
   const usernameInput = page.getByLabel(/Username/i)
     .or(page.locator('input[name="username"]'))
     .or(page.getByPlaceholder(/Username/i));
 
-  // 3. Wait for EITHER the IDP screen OR the Username field to appear
+  //wait for the IDP screen OR the Username field to appear
   try {
     await Promise.race([
       idpScreenText.waitFor({ state: 'visible', timeout: 15000 }),
@@ -30,40 +29,37 @@ setup('authenticate to OpenShift Cluster', async ({ page, baseURL }) => {
     console.log("Timed out waiting for OpenShift login page to render.");
   }
 
-  // Set a default user to prevent undefined errors if you forget to export it
+  const idpName = process.env.IDP || 'kube:admin'; 
   const user = process.env.CLUSTER_USER || 'kubeadmin';
 
-  // 4. Handle the IDP Screen if it exists
   if (await idpScreenText.isVisible()) {
-    console.log("IDP selection screen detected. Selecting provider...");
+    console.log(`IDP selection screen detected. Selecting provider: "${idpName}"`);
 
-    // Decide which IDP to click based on the user
-    const idpRegex = (user === 'kubeadmin') ? /kube:admin/i : /htpasswd/i;
+    // look for the specific IDP 
+    const idpLink = page.getByRole('link', { name: new RegExp(idpName, 'i') });
 
-    // OpenShift IDPs are usually links styled as buttons
-    await page.getByRole('link', { name: idpRegex }).click();
+    await idpLink.waitFor({ state: 'visible', timeout: 5000 });
+    await idpLink.click();
   } else {
-    console.log("No IDP screen detected, proceeding directly to credentials...");
+    console.log("No IDP screen detected (or already selected), proceeding to credentials...");
   }
 
-  // 5. Fill in Cluster Credentials
+  // fill in the Credentials
   await usernameInput.waitFor({ state: 'visible', timeout: 10000 });
-  await usernameInput.fill(user); // Using the fallback variable defined above
+  await usernameInput.fill(user); 
 
   const passwordInput = page.getByLabel(/Password/i)
     .or(page.locator('input[name="password"]'))
     .or(page.getByPlaceholder(/Password/i));
 
-  // Assert that password exists so we don't accidentally type 'undefined'
   if (!process.env.CLUSTER_PASSWORD) {
       throw new Error("CLUSTER_PASSWORD is not set in the environment!");
   }
 
   await passwordInput.fill(process.env.CLUSTER_PASSWORD);
   await page.getByRole('button', { name: /Log in/i }).click();
 
-  // 6. Save this pure OpenShift auth state
-  // Added a brief wait to ensure login completes before saving state
+  //save the auth state
   await page.waitForLoadState('networkidle');
   await page.context().storageState({ path: authFile });
 });

test/ui-e2e/run-ui-tests.sh

@@ -20,7 +20,7 @@ if ! oc whoami > /dev/null 2>&1; then
 fi
 
 #find the URLs for console and argocd 
-echo "🔍 Discovering component URLs..."
+echo "Discovering component URLs..."
 export ARGOCD_URL=$(oc get route openshift-gitops-server -n openshift-gitops -o jsonpath='{"https://"}{.spec.host}')
 export CONSOLE_URL=$(oc whoami --show-console)
 

test/ui-e2e/src/pages/LoginPage.ts

@@ -1,4 +1,4 @@
-import { Page, expect } from '@playwright/test';
+import { Page } from '@playwright/test';
 
 export class LoginPage {
   readonly page: Page;
@@ -8,58 +8,58 @@ export class LoginPage {
   }
 
   async goto() {
+    //navigate to the baseURL defined in playwright.config.ts
     await this.page.goto('/');
   }
 
+  //login Via OpenShift SSO
   async loginViaOpenShift(user: string, pass: string, idp: string = 'kube:admin') {
-
-    // ======================================================
-    //  Argo CD Login Screen
-    // ======================================================
-    // We just wait patiently. Even if Argo CD does its weird 
-    // redirect dance for 2 seconds, Playwright will wait up to 
-    // 10 seconds for this button to finally appear.
+    //click the SSO button on the Argo CD landing page
     const ssoButton = this.page.getByText(/LOG IN VIA OPENSHIFT/i);
     await ssoButton.waitFor({ state: 'visible', timeout: 10000 });
     await ssoButton.click();
 
-    // ======================================================
-    // OpenShift Login (with optional IDP step)
-    // ======================================================
-    // Sometimes OpenShift asks which IDP to use. We check for it quickly.
+    //handle the OpenShift IDP selection screen if it appears
     try {
         const idpButton = this.page.getByText(idp, { exact: true });
-        // Only wait 3 seconds. If it's not there, OpenShift skipped straight to the form.
         await idpButton.waitFor({ state: 'visible', timeout: 3000 });
         await idpButton.click();
-        console.log(`Clicked IDP: ${idp}`);
     } catch (e) {
-        console.log('No IDP selection screen, proceeding to credentials form...');
+        //if it's not there then OpenShift likely defaulted to another
     }
 
-    // Now fill out the actual Username/Password form
+    //fil out the OpenShift credentials 
     await this.page.getByLabel(/Username/i).waitFor({ state: 'visible' });
     await this.page.getByLabel(/Username/i).fill(user);
     await this.page.getByLabel(/Password/i).fill(pass);
     await this.page.getByRole('button', { name: /Log in/i }).click();
 
-    // ======================================================
-    // Authorize Access (First Login Only)
-    // ======================================================
+    //Auth Handle the Allow Permissions screen
     try {
-      const allowButton = this.page.getByRole('button', { name: 'Allow selected permissions' });
-      // Wait 5 seconds. If it's not there, we've already authorized in the past.
+      const allowButton = this.page.getByRole('button', { name: /Allow selected permissions/i });
       await allowButton.waitFor({ state: 'visible', timeout: 5000 });
       await allowButton.click();
-      console.log('Clicked Authorize Access button.');
     } catch (error) {
-      console.log('No Authorize screen appeared, continuing...');
+      // Screen didn't appear likely already authorised. 
     }
 
-    // ======================================================
-    // Argo CD Dashboard (Success)
-    // ======================================================
-    // Wait for the URL to change to the applications dashboard
+    //Success Checking make we land on the applications dashboard
     await this.page.waitForURL('**/applications**', { timeout: 20000 }); 
   }
+
+  //login As Local Admin
+  async loginAsLocalAdmin(password: string) {
+    //force the local login screen by appending ?dex=none
+    await this.page.goto(`${this.page.url()}?dex=none`);
+    
+    //fill out the local admin credentials
+    const userField = this.page.getByRole('textbox').first();
+    await userField.waitFor({ state: 'visible' });
+    await userField.fill('admin');
+    
+    await this.page.locator('input[type="password"]').fill(password);
+    
+    //Click sign in
+    await this.page.getByRole('button', { name: /sign in/i }).click();
+  }
 }

test/ui-e2e/tests/login.spec.ts

@@ -1,24 +1,23 @@
 import { test, expect } from '@playwright/test';
 import { LoginPage } from '../src/pages/LoginPage';
 
-test.describe('Authentication Flow', () => {
+test.describe('Argo CD SSO Authentication', () => {
 
-  // don't not use the saved login state
-  // make sure we always get to the argo login screen, even after setup.ts already ran.
+  //clear storageState to force a full login flow for this specific test
   test.use({ storageState: { cookies: [], origins: [] } });
 
-  //login via openshift
-  test('Scenario: Successful OpenShift SSO Login', async ({ page }) => {
+  test('should successfully log in via OpenShift SSO', async ({ page }) => {
     const loginPage = new LoginPage(page);
+    
     await loginPage.goto();
 
     await loginPage.loginViaOpenShift(
       process.env.CLUSTER_USER!,
       process.env.CLUSTER_PASSWORD!,
-      process.env.IDP
+      process.env.IDP || 'kube:admin'
     );
 
-    const newAppButton = page.getByRole('button', { name: /NEW APP/i });
-    await expect(newAppButton).toBeVisible({ timeout: 15000 });
+    //Check the button is visible as proof of successful login
+    await expect(page.getByRole('button', { name: /NEW APP/i })).toBeVisible({ timeout: 15000 });
   });
 });