✅(e2e) global setup authentication

Because of the parallelism of the tests,
the authentication setup was flaky. Sometimes
the tests would run before the authentication
was complete.
We change to a global setup instead of the
project dependency setup, it should be more
reliable.
We improved the waiting states of the authentication
setup.

src/frontend/apps/e2e/__tests__/app-impress/auth.setup.ts

@@ -1,27 +1,46 @@
-import { test as setup } from '@playwright/test';
+import { FullConfig, FullProject, chromium, expect } from '@playwright/test';
 
 import { keyCloakSignIn } from './common';
 
-setup('authenticate-chromium', async ({ page }) => {
-  await page.goto('/');
-  await keyCloakSignIn(page, 'chromium');
-  await page
-    .context()
-    .storageState({ path: `playwright/.auth/user-chromium.json` });
-});
+const saveStorageState = async (
+  browserConfig: FullProject<unknown, unknown>,
+) => {
+  const browserName = browserConfig?.name || 'chromium';
 
-setup('authenticate-webkit', async ({ page }) => {
-  await page.goto('/');
-  await keyCloakSignIn(page, 'webkit');
-  await page
-    .context()
-    .storageState({ path: `playwright/.auth/user-webkit.json` });
-});
+  const { storageState, ...useConfig } = browserConfig?.use;
+  const browser = await chromium.launch();
+  const context = await browser.newContext(useConfig);
+  const page = await context.newPage();
 
-setup('authenticate-firefox', async ({ page }) => {
-  await page.goto('/');
-  await keyCloakSignIn(page, 'firefox');
-  await page
-    .context()
-    .storageState({ path: `playwright/.auth/user-firefox.json` });
-});
+  await page.goto('/', { waitUntil: 'networkidle' });
+  await page.content();
+  await expect(page.getByText('Docs').first()).toBeVisible();
+
+  await keyCloakSignIn(page, browserName);
+
+  await expect(
+    page.locator('header').first().getByRole('button', {
+      name: 'Logout',
+    }),
+  ).toBeVisible();
+
+  await page.context().storageState({
+    path: storageState as string,
+  });
+
+  await browser.close();
+};
+
+async function globalSetup(config: FullConfig) {
+  /* eslint-disable @typescript-eslint/no-non-null-assertion */
+  const chromeConfig = config.projects.find((p) => p.name === 'chromium')!;
+  const firefoxConfig = config.projects.find((p) => p.name === 'firefox')!;
+  const webkitConfig = config.projects.find((p) => p.name === 'webkit')!;
+  /* eslint-enable @typescript-eslint/no-non-null-assertion */
+
+  await saveStorageState(chromeConfig);
+  await saveStorageState(webkitConfig);
+  await saveStorageState(firefoxConfig);
+}
+
+export default globalSetup;

src/frontend/apps/e2e/playwright.config.ts

@@ -38,10 +38,9 @@ export default defineConfig({
     timeout: 120 * 1000,
     reuseExistingServer: true,
   },
-
+  globalSetup: require.resolve('./__tests__/app-impress/auth.setup'),
   /* Configure projects for major browsers */
   projects: [
-    { name: 'setup', testMatch: /.*\.setup\.ts/ },
     {
       name: 'chromium',
       use: {
@@ -53,7 +52,6 @@ export default defineConfig({
           permissions: ['clipboard-read', 'clipboard-write'],
         },
       },
-      dependencies: ['setup'],
     },
     {
       name: 'webkit',
@@ -63,7 +61,6 @@ export default defineConfig({
         timezoneId: 'Europe/Paris',
         storageState: 'playwright/.auth/user-webkit.json',
       },
-      dependencies: ['setup'],
     },
     {
       name: 'firefox',
@@ -79,7 +76,6 @@ export default defineConfig({
           },
         },
       },
-      dependencies: ['setup'],
     },
   ],
 });