Initial Playwright E2E Test for App Mode in Electron

[vyncent-t]

Description

This PR introduces a functional Playwright end-to-end (E2E) test for the app mode of the Headlamp project using Electron. In previous attempts, we tried leveraging the current E2E test configuration used in live production; however, this setup proved incompatible with the app mode.

As a result, we are focusing on developing and stabilizing app mode tests locally. For now, test execution will remain local-only, ensuring smoother development until we revisit integration with other environments.

This PR also introduces scripts that simplify running tests in both app mode and web mode. These scripts will help streamline the testing process and ensure a more consistent workflow across different environments.

A future PR will introduce further automation to improve the ease of switching between local app mode and local web mode. Earlier attempts to combine app mode with in-cluster configurations were unstable, so these modes will remain separate for now.

---

Steps to Use This Test

Prerequisites

1. Ensure Minikube is installed and running with an instance named 'minikube'.
2. Navigate to the E2E test directory:
   cd headlamp/app/e2e-tests

---

Manual Testing

• Set the environment variable to app before running tests:
  export PLAYWRIGHT_TEST_MODE='app'

• To test in web mode, switch the environment variable:
  export PLAYWRIGHT_TEST_MODE='web'

---

Automated Script Testing

These scripts simplify running the Playwright tests for both app mode and web mode. Note that switching between modes will likely cause the backend to disconnect, and you’ll need to restart the backend if switching from app to web mode during testing.

Available Scripts

• test-app: Runs the tests in app mode.
  PLAYWRIGHT_TEST_MODE=app playwright test

• test-web: Runs the tests in web mode.
  PLAYWRIGHT_TEST_MODE=web playwright test

Flags:

Add the following flags at the end of each script command to use

• ui: run flag --ui to launch in ui mode
• headed: run flag --headed to view the test

[vyncent-t]

last push fixes failing tests for web / app / incluster and are all now working for namespace playwright test

note: remove headless use

[vyncent-t]

NOTE: trying to see if rebasing to the current main fixes the build failure, also removing 'incluster' just to try letting the CI work

[illume]

Suggestion for how to proceed.

• backup of your branch
• introduce one small change at a time using (atomic commits) and check CI passes for each commit

[vyncent-t]

last push adds the working app playwright test for namespaces

Note: The testing for app mode coverage must be done locally at this point as it is too unstable to add to into the CI builder. This test is meant to be the foundation for later app coverage test.

The test will require some pre set up steps before running

• run a minikube cluster running named 'minikube'
• set the env var PLAYWRIGHT_TEST_MODE=app in the dir where you will be running the test locally

[vyncent-t]

I will be creating a different PR later for enabling of faster and easier testing using scripts

[illume]

• need to add instructions for how to use to README
• test-web needs instructions to start
• test-app fails with

  1) [chromium] › namespaces.spec.ts:43:7 › create a namespace with the minimal editor › create a namespace with the minimal editor then delete it

    Error: page.waitForSelector: Target page, context or browser has been closed
    Call log:
      - waiting for locator('span:has-text("Namespaces")') to be visible


       at namespacesPage.ts:10

       8 |     await this.page.waitForSelector('span:has-text("Cluster")');
       9 |     await this.page.getByText('Cluster', { exact: true }).click();
    > 10 |     await this.page.waitForSelector('span:has-text("Namespaces")');
         |                     ^
      11 |     await this.page.click('span:has-text("Namespaces")');
      12 |     await this.page.waitForLoadState('load');
      13 |   }

        at NamespacesPage.navigateToNamespaces (/home/rene/dev/headlamp/app/e2e-tests/tests/namespacesPage.ts:10:21)
        at /home/rene/dev/headlamp/app/e2e-tests/tests/namespaces.spec.ts:53:5

[skoeva]

Seems to be working on my end:

[vyncent-t]

removed a dialog line that was spelled wrong