fix(tests): local-setup e2e playwright tests

.github/workflows/kind-localsetup.yaml

@@ -101,7 +101,8 @@ jobs:
           cd local-setup/e2e
           npm install
           npm ci
-          npx playwright install 
+          npx playwright install
+          sleep 20
 
       # Step 10: Run the end-to-end tests
       - name: End2End tests
@@ -112,3 +113,12 @@ jobs:
           curl -ki https://portal.dev.local:8443
           cd local-setup/e2e/
           npx playwright test
+
+      - name: Upload Playwright artefacts
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: playwright-artifacts
+          path: |
+            local-setup/e2e/test-results/
+            local-setup/e2e/*.png

.gitignore

@@ -19,3 +19,4 @@ ocm/.ocm/transport.ctf/
 registry-ca.pem
 .ocm/.ocmconfig
 local-setup/rootCA.pem
+local-setup/e2e/node_modules/

Taskfile.yaml

@@ -459,4 +459,13 @@ tasks:
   ocm:build-apply:iterate:
     cmds:
       - task: ocm:build:component
-      - task: ocm:kustomize:apply
+      - task: ocm:kustomize:apply
+
+  test:portal-e2e:
+    cmds:
+      - |
+          pushd local-setup/e2e
+          npm ci
+          npx playwright install
+          npx playwright test
+          popd

local-setup/e2e/test-register-and-navigate.test.ts

@@ -1,26 +1,50 @@
-import test, { expect } from '@playwright/test';
+import test, { expect, Page } from '@playwright/test';
 
-test.describe('Home Page', () => {
-  test('Register and navigate to portal', async ({ page }) => {
-    await page.goto('https://portal.dev.local:8443/');
+const portalBaseUrl = 'https://portal.dev.local:8443/';
 
-    // Interact with the page
-    await page.click('text=Register');
+async function activateUserEmailViaMailpit(
+  page: Page,
+  userEmail: string
+): Promise<Page> {
+  await page.goto(`${portalBaseUrl}mailpit/`);
+  await page.click(`text=To: ${userEmail}`);
+  const emailFrame = page.frameLocator('#preview-html');
+
+  // Wait for the new page to open when clicking the verification link
+  const [newPage] = await Promise.all([
+    page.context().waitForEvent('page'),
+    emailFrame.locator('text=Link to e-mail address verification').click(),
+  ]);
+
+  return newPage;
+}
 
-    // Fill in registration form
-    await page.fill('input[name="email"]', '[email protected]');
-    await page.fill('input[id="password"]', 'MyPass1234');
-    await page.fill('input[id="password-confirm"]', 'MyPass1234');
-    await page.fill('input[id="firstName"]', 'Firstname');
-    await page.fill('input[id="lastName"]', 'Lastname');
+test.describe('Home Page', () => {
+  const userEmail = '[email protected]';
+  const userPassword = 'MyPass1234';
+  const firstName = 'Firstname';
+  const lastName = 'Lastname';
 
-    // Wait for navigation after clicking register
+  test('Register and navigate to portal', async ({ page }) => {
+    await page.goto(portalBaseUrl);
+    await page.click('text=Register');
+    await page.fill('input[name="email"]', userEmail);
+    await page.fill('input[id="password"]', userPassword);
+    await page.fill('input[id="password-confirm"]', userPassword);
+    await page.fill('input[id="firstName"]', firstName);
+    await page.fill('input[id="lastName"]', lastName);
+
     await Promise.all([
       page.waitForNavigation({ waitUntil: 'networkidle' }),
       page.click('input[value="Register"]')
     ]);
 
-    const title = await page.title();
-    expect(title).toBe('Platform Mesh Portal');
+    const newPage = await activateUserEmailViaMailpit(page, userEmail);
+
+    // Wait for the new page to load and check for the existence of specific text
+    await newPage.waitForLoadState('domcontentloaded');
+    const verificationText = await newPage.getByText("Welcome to the Platform Mesh Portal!");
+    await expect(verificationText).toBeVisible();
+
   });
 });