test(ui): Add e2e test for OCI Provider

.github/workflows/ui-e2e-tests.yml

@@ -10,6 +10,7 @@ on:
       - 'ui/**'
 
 jobs:
+
   e2e-tests:
     if: github.repository == 'prowler-cloud/prowler'
     runs-on: ubuntu-latest
@@ -33,12 +34,50 @@ jobs:
       E2E_M365_SECRET_ID: ${{ secrets.E2E_M365_SECRET_ID }}
       E2E_M365_TENANT_ID: ${{ secrets.E2E_M365_TENANT_ID }}
       E2E_M365_CERTIFICATE_CONTENT: ${{ secrets.E2E_M365_CERTIFICATE_CONTENT }}
-      E2E_NEW_PASSWORD: ${{ secrets.E2E_NEW_PASSWORD }}
+      E2E_KUBERNETES_CONTEXT: 'kind-kind'
+      E2E_KUBERNETES_KUBECONFIG_PATH: /home/runner/.kube/config
+      E2E_GCP_BASE64_SERVICE_ACCOUNT_KEY: ${{ secrets.E2E_GCP_BASE64_SERVICE_ACCOUNT_KEY }}
+      E2E_GCP_PROJECT_ID: ${{ secrets.E2E_GCP_PROJECT_ID }}
+      E2E_GITHUB_APP_ID: ${{ secrets.E2E_GITHUB_APP_ID }}
+      E2E_GITHUB_BASE64_APP_PRIVATE_KEY: ${{ secrets.E2E_GITHUB_BASE64_APP_PRIVATE_KEY }}
+      E2E_GITHUB_USERNAME: ${{ secrets.E2E_GITHUB_USERNAME }}
+      E2E_GITHUB_PERSONAL_ACCESS_TOKEN: ${{ secrets.E2E_GITHUB_PERSONAL_ACCESS_TOKEN }}
+      E2E_GITHUB_ORGANIZATION: ${{ secrets.E2E_GITHUB_ORGANIZATION }}
+      E2E_GITHUB_ORGANIZATION_ACCESS_TOKEN: ${{ secrets.E2E_GITHUB_ORGANIZATION_ACCESS_TOKEN }}
+      E2E_ORGANIZATION_ID: ${{ secrets.E2E_ORGANIZATION_ID }}
+      E2E_OCI_TENANCY_ID: ${{ secrets.E2E_OCI_TENANCY_ID }}
+      E2E_OCI_USER_ID: ${{ secrets.E2E_OCI_USER_ID }}
+      E2E_OCI_FINGERPRINT: ${{ secrets.E2E_OCI_FINGERPRINT }}
+      E2E_OCI_KEY_CONTENT: ${{ secrets.E2E_OCI_KEY_CONTENT }}
+      E2E_OCI_REGION: ${{ secrets.E2E_OCI_REGION }}
+      E2E_NEW_USER_PASSWORD: ${{ secrets.E2E_NEW_USER_PASSWORD }}
+
     steps:
       - name: Checkout repository
         uses: actions/checkout@08c6903cd8c0fde910a37f88322edcfb5dd907a8 # v5.0.0
+      - name: Create k8s Kind Cluster
+        uses: helm/kind-action@v1
+        with:
+          cluster_name: kind
+      - name: Modify kubeconfig
+        run: |
+            # Modify the kubeconfig to use the kind cluster server to https://kind-control-plane:6443
+            # from worker service into docker-compose.yml
+            kubectl config set-cluster kind-kind --server=https://kind-control-plane:6443
+            kubectl config view
+      - name: Add network kind to docker compose
+        run: |
+          # Add the network kind to the docker compose to interconnect to kind cluster
+          yq -i '.networks.kind.external = true' docker-compose.yml
+          # Add network kind to worker service and default network too
+          yq -i '.services.worker.networks = ["kind","default"]' docker-compose.yml
       - name: Fix API data directory permissions
         run: docker run --rm -v $(pwd)/_data/api:/data alpine chown -R 1000:1000 /data
+      - name: Add AWS credentials for testing AWS SDK Default Adding Provider
+        run: |
+          echo "Adding AWS credentials for testing AWS SDK Default Adding Provider..."
+          echo "AWS_ACCESS_KEY_ID=${{ secrets.E2E_AWS_PROVIDER_ACCESS_KEY }}" >> .env
+          echo "AWS_SECRET_ACCESS_KEY=${{ secrets.E2E_AWS_PROVIDER_SECRET_KEY }}" >> .env
       - name: Start API services
         run: |
           # Override docker-compose image tag to use latest instead of stable

ui/package.json

@@ -15,10 +15,10 @@
     "format:check": "./node_modules/.bin/prettier --check ./app",
     "format:write": "./node_modules/.bin/prettier --config .prettierrc.json --write ./app",
     "prepare": "husky",
-    "test:e2e": "playwright test --project=chromium --project=sign-up --project=providers",
-    "test:e2e:ui": "playwright test --project=chromium --project=sign-up --project=providers --ui",
-    "test:e2e:debug": "playwright test --project=chromium --project=sign-up --project=providers --debug",
-    "test:e2e:headed": "playwright test --project=chromium --project=sign-up --project=providers --headed",
+    "test:e2e": "playwright test --project=chromium --project=sign-up --project=providers --project=invitations --project=scans",
+    "test:e2e:ui": "playwright test --project=chromium --project=sign-up --project=providers --project=invitations --project=scans --ui",
+    "test:e2e:debug": "playwright test --project=chromium --project=sign-up --project=providers --project=invitations --project=scans --debug",
+    "test:e2e:headed": "playwright test --project=chromium --project=sign-up --project=providers --project=invitations --project=scans --headed",
     "test:e2e:report": "playwright show-report",
     "test:e2e:install": "playwright install"
   },

ui/playwright.config.ts

@@ -98,12 +98,24 @@ export default defineConfig({
       name: "sign-up",
       testMatch: "sign-up.spec.ts",
     },
+    // This project runs the scans test suite
+    {
+      name: "scans",
+      testMatch: "scans.spec.ts",
+      dependencies: ["admin.auth.setup"],
+    },
     // This project runs the providers test suite
     {
       name: "providers",
       testMatch: "providers.spec.ts",
       dependencies: ["admin.auth.setup"],
     },
+    // This project runs the invitations test suite
+    {
+      name: "invitations",
+      testMatch: "invitations.spec.ts",
+      dependencies: ["admin.auth.setup"],
+    },
   ],
 
   webServer: {

ui/tests/base-page.ts

@@ -6,15 +6,15 @@ import { Page, Locator, expect } from "@playwright/test";
  */
 export abstract class BasePage {
   readonly page: Page;
-  
+
   // Common UI elements that appear on most pages
   readonly title: Locator;
   readonly loadingIndicator: Locator;
   readonly themeToggle: Locator;
 
   constructor(page: Page) {
     this.page = page;
-    
+
     // Common locators that most pages share
     this.title = page.locator("h1, h2, [role='heading']").first();
     this.loadingIndicator = page.getByRole("status", { name: "Loading" });
@@ -24,21 +24,14 @@ export abstract class BasePage {
   // Common navigation methods
   async goto(url: string): Promise<void> {
     await this.page.goto(url);
-    await this.waitForPageLoad();
-  }
-
-  async waitForPageLoad(): Promise<void> {
-    await this.page.waitForLoadState("networkidle");
   }
 
   async refresh(): Promise<void> {
     await this.page.reload();
-    await this.waitForPageLoad();
   }
 
   async goBack(): Promise<void> {
     await this.page.goBack();
-    await this.waitForPageLoad();
   }
 
   // Common verification methods
@@ -119,14 +112,14 @@ export abstract class BasePage {
   async getFormErrors(): Promise<string[]> {
     const errorElements = await this.page.locator('[role="alert"], .error-message, [data-testid="error"]').all();
     const errors: string[] = [];
-    
+
     for (const element of errorElements) {
       const text = await element.textContent();
       if (text) {
         errors.push(text.trim());
       }
     }
-    
+
     return errors;
   }
 
@@ -137,23 +130,28 @@ export abstract class BasePage {
 
   // Common wait methods
   async waitForElement(element: Locator, timeout: number = 5000): Promise<void> {
+
     await element.waitFor({ timeout });
   }
 
   async waitForElementToDisappear(element: Locator, timeout: number = 5000): Promise<void> {
+
     await element.waitFor({ state: "hidden", timeout });
   }
 
   async waitForUrl(expectedUrl: string | RegExp, timeout: number = 5000): Promise<void> {
+
     await this.page.waitForURL(expectedUrl, { timeout });
   }
 
   // Common screenshot methods
   async takeScreenshot(name: string): Promise<void> {
+
     await this.page.screenshot({ path: `screenshots/${name}.png` });
   }
 
   async takeElementScreenshot(element: Locator, name: string): Promise<void> {
+
     await element.screenshot({ path: `screenshots/${name}.png` });
   }
 }

ui/tests/helpers.ts

@@ -1,5 +1,7 @@
-import { Page, expect } from "@playwright/test";
+import { Locator, Page, expect } from "@playwright/test";
 import { SignInPage, SignInCredentials } from "./sign-in/sign-in-page";
+import { AWSProviderCredential, AWSProviderData, AWS_CREDENTIAL_OPTIONS, ProvidersPage } from "./providers/providers-page";
+import { ScansPage } from "./scans/scans-page";
 
 export const ERROR_MESSAGES = {
   INVALID_CREDENTIALS: "Invalid email or password",
@@ -191,3 +193,187 @@ export async function verifySessionValid(page: Page) {
   expect(session.refreshToken).toBeTruthy();
   return session;
 }
+
+
+export async function addAWSProvider(
+  page: Page,
+  accountId: string,
+  accessKey: string,
+  secretKey: string,
+): Promise<void> {
+  // Prepare test data for AWS provider
+  const awsProviderData: AWSProviderData = {
+    accountId: accountId,
+    alias: "Test E2E AWS Account - Credentials",
+  };
+
+  // Prepare static credentials
+  const staticCredentials: AWSProviderCredential = {
+    type: AWS_CREDENTIAL_OPTIONS.AWS_CREDENTIALS,
+    accessKeyId: accessKey,
+    secretAccessKey: secretKey,
+  };
+
+  // Create providers page object
+  const providersPage = new ProvidersPage(page);
+
+  // Navigate to providers page
+  await providersPage.goto();
+  await providersPage.verifyPageLoaded();
+
+  // Start adding new provider
+  await providersPage.clickAddProvider();
+  await providersPage.verifyConnectAccountPageLoaded();
+
+  // Select AWS provider
+  await providersPage.selectAWSProvider();
+
+  // Fill provider details
+  await providersPage.fillAWSProviderDetails(awsProviderData);
+  await providersPage.clickNext();
+
+  // Verify credentials page is loaded
+  await providersPage.verifyCredentialsPageLoaded();
+
+  // Select static credentials type
+  await providersPage.selectCredentialsType(
+    AWS_CREDENTIAL_OPTIONS.AWS_CREDENTIALS,
+  );
+  // Fill static credentials
+  await providersPage.fillStaticCredentials(staticCredentials);
+  await providersPage.clickNext();
+
+  // Launch scan
+  await providersPage.verifyLaunchScanPageLoaded();
+  await providersPage.clickNext();
+
+  // Wait for redirect to provider page
+  const scansPage = new ScansPage(page);
+  await scansPage.verifyPageLoaded();
+}
+
+export async function deleteProviderIfExists(page: ProvidersPage, providerUID: string): Promise<void> {
+  // Delete the provider if it exists
+
+  // Navigate to providers page
+  await page.goto();
+  await expect(page.providersTable).toBeVisible({ timeout: 10000 });
+
+  // Find and use the search input to filter the table
+  const searchInput = page.page.getByPlaceholder(/search|filter/i);
+
+  await expect(searchInput).toBeVisible({ timeout: 5000 });
+
+  // Clear and search for the specific provider
+  await searchInput.clear();
+  await searchInput.fill(providerUID);
+  await searchInput.press("Enter");
+
+  // Additional wait for React table to re-render with the server-filtered data
+  // The filtering happens on the server, but the table component needs time
+  // to process the response and update the DOM after network idle
+  await page.page.waitForTimeout(1500);
+
+  // Get all rows from the table
+  const allRows = page.providersTable.locator("tbody tr");
+
+  // Helper function to check if a row is the "No results" row
+  const isNoResultsRow = async (row: Locator): Promise<boolean> => {
+    const text = await row.textContent();
+    return text?.includes("No results") || text?.includes("No data") || false;
+  };
+
+  // Helper function to find the row with the specific UID
+  const findProviderRow = async (): Promise<Locator | null> => {
+    const count = await allRows.count();
+
+    for (let i = 0; i < count; i++) {
+      const row = allRows.nth(i);
+
+      // Skip "No results" rows
+      if (await isNoResultsRow(row)) {
+        continue;
+      }
+
+      // Check if this row contains the UID in the UID column (column 3)
+      const uidCell = row.locator("td").nth(3);
+      const uidText = await uidCell.textContent();
+
+      if (uidText?.includes(providerUID)) {
+        return row;
+      }
+    }
+
+    return null;
+  };
+
+  // Wait for filtering to complete (max 0 or 1 data rows)
+  await expect(async () => {
+
+    await findProviderRow();
+    const count = await allRows.count();
+
+    // Count only real data rows (not "No results")
+    let dataRowCount = 0;
+    for (let i = 0; i < count; i++) {
+      if (!(await isNoResultsRow(allRows.nth(i)))) {
+        dataRowCount++;
+      }
+    }
+
+    // Should have 0 or 1 data row
+    expect(dataRowCount).toBeLessThanOrEqual(1);
+  }).toPass({ timeout: 20000 });
+
+  // Find the provider row
+  const targetRow = await findProviderRow();
+
+  if (!targetRow) {
+    // Provider not found, nothing to delete
+    // Navigate back to providers page to ensure clean state
+    await page.goto();
+    await expect(page.providersTable).toBeVisible({ timeout: 10000 });
+    return;
+  }
+
+  // Find and click the action button (last cell = actions column)
+  const actionButton = targetRow
+    .locator("td")
+    .last()
+    .locator("button")
+    .first();
+
+  // Ensure the button is in view before clicking (handles horizontal scroll)
+  await actionButton.scrollIntoViewIfNeeded();
+  // Verify the button is visible
+  await expect(actionButton).toBeVisible({ timeout: 5000 });
+  await actionButton.click();
+
+  // Wait for dropdown menu to appear and find delete option
+  const deleteMenuItem = page.page.getByRole("menuitem", {
+    name: /delete.*provider/i,
+  });
+
+  await expect(deleteMenuItem).toBeVisible({ timeout: 5000 });
+  await deleteMenuItem.click();
+
+  // Wait for confirmation modal to appear
+  const modal = page.page
+    .locator('[role="dialog"], .modal, [data-testid*="modal"]')
+    .first();
+
+  await expect(modal).toBeVisible({ timeout: 10000 });
+
+  // Find and click the delete confirmation button
+  await expect(page.deleteProviderConfirmationButton).toBeVisible({
+    timeout: 5000,
+  });
+  await page.deleteProviderConfirmationButton.click();
+
+  // Wait for modal to close (this indicates deletion was initiated)
+  await expect(modal).not.toBeVisible({ timeout: 10000 });
+
+  // Navigate back to providers page to ensure clean state
+  await page.goto();
+  await expect(page.providersTable).toBeVisible({ timeout: 10000 });
+}