Merge pull request #507 from kravciak/main

Add navigation helpers

tests/e2e/10-landing.spec.ts

@@ -1,12 +1,7 @@
 import { test, expect } from './rancher-test';
-import { KubewardenPage } from './pages/kubewarden.page';
-import { PolicyServersPage } from './pages/policyservers.page';
-import { AdmissionPoliciesPage } from './pages/admissionpolicies.page';
-import { ClusterAdmissionPoliciesPage } from './pages/clusteradmissionpolicies.page';
-
-test('Kubewarden Landing page', async({ page, ui }) => {
-  const kwPage = new KubewardenPage(page);
-  await kwPage.goto();
+
+test('Kubewarden Landing page', async({ page, ui, nav }) => {
+  await nav.explorer('Kubewarden')
   await expect(page.getByRole('heading', { name: 'Welcome to Kubewarden' })).toBeVisible()
 
   await expect(page.getByRole('link', { name: 'Create Policy Server' })).toBeVisible()
@@ -21,10 +16,8 @@ test('Kubewarden Landing page', async({ page, ui }) => {
   }, 'https://github.com/kubewarden/ui/issues/245')
 });
 
-test('Policy Servers Landing Page', async({ page, ui }) => {
-  const psPage = new PolicyServersPage(page);
-  await psPage.goto();
-
+test('Policy Servers Landing Page', async({ page, ui, nav }) => {
+  await nav.explorer('Kubewarden', 'PolicyServers')
   await expect(page.getByRole('heading', { name: 'PolicyServers' })).toBeVisible()
 
   // Default policy server
@@ -37,19 +30,17 @@ test('Policy Servers Landing Page', async({ page, ui }) => {
   await expect(page.locator('td.col-policy-server-status')).toHaveCount(1);
 });
 
-test('Cluster Admission Policies Landing page', async({ page }) => {
-  const capPage = new ClusterAdmissionPoliciesPage(page);
-  await capPage.goto();
+test('Cluster Admission Policies Landing page', async({ page, nav }) => {
+  await nav.explorer('Kubewarden', 'ClusterAdmissionPolicies')
 
   await expect(page.getByRole('heading', { name: 'ClusterAdmissionPolicies' })).toBeVisible()
   await expect(page.locator('.col-policy-status')).toHaveCount(6);
   await expect(page.locator('.col-policy-status').getByText('Active')).toHaveCount(6);
   await expect(page.locator('.col-link-detail').first()).not.toBeEmpty();
 });
 
-test('Admission Policies Landing page', async({ page }) => {
-  const apPage = new AdmissionPoliciesPage(page);
-  await apPage.goto();
+test('Admission Policies Landing page', async({ page, nav }) => {
+  await nav.explorer('Kubewarden', 'AdmissionPolicies')
 
   await expect(page.getByRole('heading', { name: 'AdmissionPolicies' })).toBeVisible()
   await expect(page.getByText('There are no rows to show.')).toBeVisible()

tests/e2e/60-tracing.spec.ts

@@ -1,6 +1,5 @@
 import { test, expect } from './rancher-test';
 import { Chart, RancherAppsPage } from './pages/rancher-apps.page';
-import { PolicyServersPage } from './pages/policyservers.page';
 
 /**
  * Expect timeout has to be increased after telemetry installation on local cluster
@@ -37,15 +36,13 @@ test('Enable tracing in Kubewarden', async ({ page, ui }) => {
     done`)
 });
 
-test('Check traces are visible', async ({ page, ui }) => {
+test('Check traces are visible', async ({ page, ui, nav }) => {
   const tracingTab = page.getByRole('tablist').locator('li#policy-tracing')
   const policiesTab = page.getByRole('tablist').locator('li#related-policies')
   const logline = ui.getRow('tracing-privpod').row.first()
 
-  const psPage = new PolicyServersPage(page)
-  await psPage.goto()
-
   // Create trace log line
+  await nav.explorer('Kubewarden', 'PolicyServers')
   await ui.shell('k run tracing-privpod --image=nginx:alpine --privileged')
   console.warn('Workaround: Opentelemetry not installed warning before I generate traces')
   await page.reload()

tests/e2e/components/navigation.ts

@@ -0,0 +1,52 @@
+import { expect, Page } from '@playwright/test';
+
+type ExpGroup = 'Cluster' | 'Workloads' | 'Kubewarden' | 'Apps'
+type ExpItemMap = {
+    Cluster: 'Projects/Namespaces'
+    Workloads: 'CronJobs' | 'Deployments' | 'Jobs' | 'Pods'
+    Apps: 'Charts' | 'Installed Apps' | 'Repositories'
+    Kubewarden: 'PolicyServers' | 'ClusterAdmissionPolicies' | 'AdmissionPolicies' | 'Policy Reporter'
+};
+
+export class Navigation {
+
+    constructor(private readonly page: Page) { }
+
+    // User menu
+    async userNav(to: 'Preferences' | 'Account & API Keys' | 'Log Out') {
+        await this.page.locator('div.user-menu').click()
+        await this.page.getByTestId('user-menu-dropdown').getByRole('link', { name: to, exact: true }).click()
+    }
+
+    // Main menu - 'Home'|'Extensions'|'Global Settings'|'local'|<cluster>
+    async mainNav(to: 'Home'|'Extensions'|'Global Settings'|'local') {
+        await this.page.getByTestId('top-level-menu').click()
+        await this.page.getByTestId('side-menu').getByRole('link', { name: to, exact: true }).click()
+    }
+
+    async cluster(name: string) {
+        await this.page.goto(`dashboard/c/${name}/explorer`)
+    }
+
+    // Cluster Explorer
+    async explorer<T extends ExpGroup>(groupName: T, childName?: ExpItemMap[T]) {
+        const groupHeader = this.page.getByRole('heading', { name: groupName, exact: true })
+        const groupBlock = this.page.locator('nav.side-nav').locator('.accordion').filter({has: groupHeader})
+
+        // If test is starting with explorer navigation use local cluster
+        if (this.page.url() == "about:blank")
+            await this.cluster('local')
+
+        if (childName) {
+            // Open group if closed
+            await expect(groupBlock).toBeVisible()
+            if (await groupBlock.locator('i.icon-chevron-down').isVisible()) {
+                await groupBlock.locator('i.icon-chevron-down').click()
+            }
+            await groupBlock.getByText(childName, {exact: true}).click()
+        } else {
+            await groupBlock.locator(groupHeader).click()
+        }
+    }
+
+}

tests/e2e/pages/basepage.ts

@@ -1,11 +1,14 @@
 import type { Page } from '@playwright/test';
 import { RancherUI } from './rancher-ui'
+import { Navigation } from '../components/navigation'
 
 export abstract class BasePage {
     protected readonly ui: RancherUI;
+    protected readonly nav: Navigation;
 
     constructor(public readonly page: Page, readonly url?: string) {
         this.ui = new RancherUI(page)
+        this.nav = new Navigation(page)
     }
 
     async goto() {

tests/e2e/pages/rancher-extensions.page.ts

@@ -90,7 +90,6 @@ export class RancherExtensionsPage extends BasePage {
 
     // Check successful load message
     await expect(this.page.locator('div.growl-message').getByText(`Loaded extension ${moduleName}`, {exact: true})).toBeVisible()
-    await this.page.getByTestId('extension-reload-banner-reload-btn').click()
   }
 
 }

tests/e2e/rancher-test.ts

@@ -1,14 +1,19 @@
 import { test as base } from '@playwright/test';
 import { RancherUI } from './pages/rancher-ui';
+import { Navigation } from './components/navigation';
 
 export type TestOptions = {
-  ui: RancherUI;
+  ui: RancherUI
+  nav: Navigation
 };
 
 export const test = base.extend<TestOptions>({
   ui: async ({ page }, use) => {
     use(new RancherUI(page));
-  }
+  },
+  nav: async ({ page }, use) => {
+    use(new Navigation(page));
+  },
 });
 
 export { expect } from '@playwright/test';