chore(tests): switch to playwright test runner

Signed-off-by: Ondrej Dockal <[email protected]>
redhat-developer · Sep 3, 2024 · 36dbc17 · 36dbc17
1 parent 1453756
commit 36dbc17
Show file tree

Hide file tree

Showing 5 changed files with 78 additions and 90 deletions.
diff --git a/.gitignore b/.gitignore
@@ -4,6 +4,7 @@ builtin
 dist
 node_modules
 redhat-authentication.cdix
-tests/output
+tests/**/output
 test-resources
+test-results
 
diff --git a/package.json b/package.json
@@ -4,6 +4,7 @@
   "description": "Login to Red Hat Developers",
   "version": "1.0.2",
   "packageManager": "[email protected]+sha512.faf344af2d6ca65c4c5c8c2224ea77a81a5e8859cbc4e06b1511ddce2f0151512431dd19e6aff31f2c6a8f5f2aced9bd2273e1fed7dd4de1868984059d2c4247",
+  "type": "module",
   "icon": "icon.png",
   "publisher": "redhat",
   "license": "Apache-2.0",
@@ -43,7 +44,7 @@
     "test": "vitest run --coverage",
     "test:all": "pnpm test && pnpm test:e2e",
     "test:e2e:setup": "xvfb-maybe --auto-servernum --server-args='-screen 0 1280x960x24' --",
-    "test:e2e": "cross-env E2E_TESTS=true pnpm run test:e2e:setup vitest run tests/src/ --pool=threads --poolOptions.threads.singleThread --poolOptions.threads.isolate --no-file-parallelism"
+    "test:e2e": "cross-env E2E_TESTS=true pnpm run test:e2e:setup npx playwright test tests/src --config tests/playwright.config.ts"
   },
   "dependencies": {
     "@podman-desktop/api": "^1.12.0",
@@ -56,7 +57,7 @@
   "devDependencies": {
     "7zip-min": "^1.4.5",
     "@playwright/test": "^1.46.1",
-    "@podman-desktop/tests-playwright": "next",
+    "@podman-desktop/tests-playwright": "1.13.0-202409031414-fec4e72",
     "@types/js-yaml": "^4.0.5",
     "@types/node": "^20",
     "@typescript-eslint/eslint-plugin": "^8.3.0",

diff --git a/tests/src/setupFiles/extended-hooks.ts → tests/playwright.config.ts b/tests/src/setupFiles/extended-hooks.ts → tests/playwright.config.ts
@@ -16,9 +16,25 @@
  * SPDX-License-Identifier: Apache-2.0
  ***********************************************************************/
 
-import { type RunnerTestContext,takeScreenshotHook } from '@podman-desktop/tests-playwright';
-import { afterEach } from 'vitest';
+import { defineConfig, devices } from '@playwright/test';
 
-afterEach(async (context: RunnerTestContext) => {
-  context.onTestFailed(async () => await takeScreenshotHook(context.pdRunner, context.task.name));
+export default defineConfig({
+  outputDir: 'output/',
+  workers: 1,
+
+  reporter: [
+    ['list'],
+    ['junit', { outputFile: 'output/junit-results.xml' }],
+    ['json', { outputFile: 'output/json-results.json' }],
+    ['html', { open: 'never', outputFolder: 'output/html-results/' }],
+  ],
+
+  projects: [
+    {
+      name: 'chromium',
+      use: {
+        ...devices['Desktop Chrome'],
+      },
+    },
+  ],
 });
diff --git a/tests/src/sso-extension.spec.ts b/tests/src/sso-extension.spec.ts
@@ -17,9 +17,8 @@
  ***********************************************************************/
 import type { Page} from '@playwright/test';
 import { expect as playExpect } from '@playwright/test';
-import type { RunnerTestContext} from '@podman-desktop/tests-playwright';
 import { AuthenticationPage, ExtensionCardPage, NavigationBar, PodmanDesktopRunner, WelcomePage } from '@podman-desktop/tests-playwright';
-import { afterAll, beforeAll, beforeEach,describe, test } from 'vitest';
+import { test } from '@playwright/test';
 
 import { SSOExtensionPage } from './model/pages/sso-extension-page';
 
@@ -36,11 +35,7 @@ const activeExtensionStatus = 'ACTIVE';
 const disabledExtensionStatus = 'DISABLED';
 const skipInstallation = process.env.SKIP_INSTALLATION ? process.env.SKIP_INSTALLATION : false;
 
-beforeEach<RunnerTestContext>(async ctx => {
-  ctx.pdRunner = pdRunner;
-});
-
-beforeAll(async () => {
+test.beforeAll(async () => {
   pdRunner = new PodmanDesktopRunner({ customFolder: 'sso-tests-pd', autoUpdate: false, autoCheckUpdate: false });
   page = await pdRunner.start();
   pdRunner.setVideoAndTraceName('sso-e2e');
@@ -51,63 +46,65 @@ beforeAll(async () => {
   extensionCard = new ExtensionCardPage(page, extensionLabelName, extensionLabel);
 });
 
-afterAll(async () => {
+test.afterAll(async () => {
   await pdRunner.close();
 });
 
-describe('Red Hat Authentication extension verification', async () => {
+test.describe('Red Hat Authentication extension verification', () => {
+  test.describe('Red Hat Authentication extension installation', () => {
+    test('Go to extensions and check if extension is already installed', async () => {
+      const extensions = await navBar.openExtensions();
+      if (await extensions.extensionIsInstalled(extensionLabel)) {
+        extensionInstalled = true;
+      }
+    });
 
-  test('Go to extensions and check if extension is already installed', async () => {
-    const extensions = await navBar.openExtensions();
-    if (await extensions.extensionIsInstalled(extensionLabel)) {
-      extensionInstalled = true;
-    }
-  });
+    // we want to skip removing of the extension when we are running tests from PR check
+    test('Uninstalle previous version of sso extension', async () => {
+        test.skip(!extensionInstalled || !!skipInstallation);
+        test.setTimeout(60000);
+        await removeExtension();
+      }
+    );
+
+    test('Extension can be installed using OCI image', async () => {
+      test.skip(extensionInstalled && !skipInstallation);
+      test.setTimeout(200000);
+      const extensions = await navBar.openExtensions();
+      await extensions.installExtensionFromOCIImage(imageName);
+      await playExpect(extensionCard.card).toBeVisible();
+    });
 
-  // we want to skip removing of the extension when we are running tests from PR check
-  test.runIf(extensionInstalled && !skipInstallation)(
-    'Uninstalled previous version of sso extension',
-    async () => {
-      await removeExtension();
-    },
-    60000,
-  );
-
-  test.runIf(!skipInstallation)('Extension can be installed using OCI image', async () => {
-    const extensions = await navBar.openExtensions();
-    await extensions.installExtensionFromOCIImage(imageName);
-    await playExpect(extensionCard.card).toBeVisible();
-  }, 200000);
-
-  test('Extension card is present and active', async () => {
-    const extensions = await navBar.openExtensions();
-    await playExpect.poll(async () => 
-      await extensions.extensionIsInstalled(extensionLabel), { timeout: 30000 },
-    ).toBeTruthy();
-    const extensionCard = await extensions.getInstalledExtension(extensionLabelName, extensionLabel);
-    await playExpect(extensionCard.status).toHaveText(activeExtensionStatus);
-  });
+    test('Extension card is present and active', async () => {
+      const extensions = await navBar.openExtensions();
+      await playExpect.poll(async () => 
+        await extensions.extensionIsInstalled(extensionLabel), { timeout: 30000 },
+      ).toBeTruthy();
+      const extensionCard = await extensions.getInstalledExtension(extensionLabelName, extensionLabel);
+      await playExpect(extensionCard.status).toHaveText(activeExtensionStatus);
+    });
 
-  test('Extension Details show correct status', async () => {
-    const extensions = await navBar.openExtensions();
-    const extensionCard = await extensions.getInstalledExtension(extensionLabelName, extensionLabel);
-    await extensionCard.openExtensionDetails();
-    const details = new SSOExtensionPage(page);
-    await playExpect(details.heading).toBeVisible();
-    await playExpect(details.status).toHaveText(activeExtensionStatus);
-  });
+    test('Extension Details show correct status', async () => {
+      const extensions = await navBar.openExtensions();
+      const extensionCard = await extensions.getInstalledExtension(extensionLabelName, extensionLabel);
+      await extensionCard.openExtensionDetails('Red Hat Authentication');
+      const details = new SSOExtensionPage(page);
+      await playExpect(details.heading).toBeVisible();
+      await playExpect(details.status).toHaveText(activeExtensionStatus);
+    });
 
-  test('SSO provider is available in Authentication Page', async () => {
-    const settingsBar = await navBar.openSettings();
-    const authPage = await settingsBar.openTabPage(AuthenticationPage);
-    await playExpect(authPage.heading).toHaveText('Authentication');
-    const provider = authPage.getProvider(authProviderName);
-    await playExpect(provider.getByLabel('Provider Information').getByLabel('Provider Name')).toHaveText(authProviderName);
-    await playExpect(provider.getByLabel('Provider Information').getByLabel('Provider Status')).toHaveText('Logged out');
-    await playExpect(provider.getByLabel('Provider Actions').getByRole('button')).toContainText('Sign in');
+    test('SSO provider is available in Authentication Page', async () => {
+      const settingsBar = await navBar.openSettings();
+      const authPage = await settingsBar.openTabPage(AuthenticationPage);
+      await playExpect(authPage.heading).toHaveText('Authentication');
+      const provider = authPage.getProvider(authProviderName);
+      await playExpect(provider.getByLabel('Provider Information').getByLabel('Provider Name')).toHaveText(authProviderName);
+      await playExpect(provider.getByLabel('Provider Information').getByLabel('Provider Status')).toHaveText('Logged out');
+      await playExpect(provider.getByLabel('Provider Actions').getByRole('button')).toContainText('Sign in');
+    });
   });
 
-  describe('Red Hat Authentication extension handling', async () => {
+  test.describe('Red Hat Authentication extension handling', async () => {
     test('Extension can be disabled', async () => {
       const extensions = await navBar.openExtensions();
       playExpect(await extensions.extensionIsInstalled(extensionLabel)).toBeTruthy();

diff --git a/vitest.config.js b/vitest.config.js
@@ -71,33 +71,6 @@ function unitTestConfig() {
   };
 }
 
-function e2eTestConfig() {
-  return {
-    globals: true,
-    globalSetup: './node_modules/@podman-desktop/tests-playwright/src/globalSetup/global-setup.ts',
-    setupFiles: './tests/src/setupFiles/extended-hooks.ts',
-    /**
-     * By default, vitest search test files in all packages.
-     * For e2e tests have sense search only is project root tests folder
-     */
-    include: ['tests/src/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'],
-    exclude: excludeArray,
-
-    /**
-     * A default timeout of 5000ms is sometimes not enough for playwright.
-     */
-    testTimeout: 30_000,
-    hookTimeout: 60_000,
-    // test reporters - default for all and junit for CI
-    reporters: process.env.CI ? ['default', 'junit'] : ['verbose'],
-    outputFile: process.env.CI ? { junit: 'tests/output/junit-e2e-results.xml' } : {},
-  };
-}
-
-export function testConfig() {
-  return process.env.E2E_TESTS ? e2eTestConfig() : unitTestConfig();
-}
-
 /**
  * Config for global end-to-end tests
  * placed in project root tests folder
@@ -107,7 +80,7 @@ export function testConfig() {
 
 const config = {
   test: {
-    ...testConfig(),
+    ...unitTestConfig(),
     ...coverageConfig(PACKAGE_ROOT, PACKAGE_NAME),
   },
   resolve: {