From aa39be33cb3e3d335fc28884fdd76c7ef08e4823 Mon Sep 17 00:00:00 2001
From: Anton Misskii <124462506+amisskii@users.noreply.github.com>
Date: Thu, 12 Sep 2024 16:52:21 +0200
Subject: [PATCH] chore(test): Update Kubernetes E2E tests to handle submenu
 navigation (#8867)

* chore(test): update kubernetes tests
Signed-off-by: Anton Misskii <amisskii@redhat.com>

* fix: title
Signed-off-by: Anton Misskii <amisskii@redhat.com>
---
 .../renderer/src/SubmenuNavigation.svelte     |  2 +-
 tests/playwright/src/index.ts                 |  1 +
 .../src/model/pages/kubernetes-bar.ts         | 44 +++++++++++++++++++
 .../src/model/workbench/navigation.ts         | 23 ++++------
 tests/playwright/src/specs/kubernetes.spec.ts |  3 +-
 5 files changed, 57 insertions(+), 16 deletions(-)
 create mode 100644 tests/playwright/src/model/pages/kubernetes-bar.ts

diff --git a/packages/renderer/src/SubmenuNavigation.svelte b/packages/renderer/src/SubmenuNavigation.svelte
index 9f366b32783..b20605659cb 100644
--- a/packages/renderer/src/SubmenuNavigation.svelte
+++ b/packages/renderer/src/SubmenuNavigation.svelte
@@ -11,7 +11,7 @@ export let meta: TinroRouteMeta;
 
 <nav
   class="z-1 w-leftsidebar min-w-leftsidebar flex-col justify-between flex transition-all duration-500 ease-in-out bg-[var(--pd-secondary-nav-bg)] border-[var(--pd-global-nav-bg-border)] border-r-[1px]"
-  aria-label="PreferencesNavigation">
+  aria-label={title + ' Navigation Bar'}>
   <div class="flex items-center">
     <div class="pt-4 px-3 mb-10">
       <p
diff --git a/tests/playwright/src/index.ts b/tests/playwright/src/index.ts
index 0bf6b90b3c4..334b5ce890d 100644
--- a/tests/playwright/src/index.ts
+++ b/tests/playwright/src/index.ts
@@ -55,6 +55,7 @@ export * from './model/pages/extensions-page';
 export * from './model/pages/image-details-page';
 export * from './model/pages/image-edit-page';
 export * from './model/pages/images-page';
+export * from './model/pages/kubernetes-bar';
 export * from './model/pages/kubernetes-resource-details-page';
 export * from './model/pages/kubernetes-resource-page';
 export * from './model/pages/main-page';
diff --git a/tests/playwright/src/model/pages/kubernetes-bar.ts b/tests/playwright/src/model/pages/kubernetes-bar.ts
new file mode 100644
index 00000000000..16e308af170
--- /dev/null
+++ b/tests/playwright/src/model/pages/kubernetes-bar.ts
@@ -0,0 +1,44 @@
+/**********************************************************************
+ * Copyright (C) 2024 Red Hat, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ ***********************************************************************/
+
+import type { Locator, Page } from '@playwright/test';
+
+import type { KubernetesResources } from '../core/types';
+import { KubernetesResourcePage } from './kubernetes-resource-page';
+
+export class KubernetesBar {
+  readonly page: Page;
+  readonly kubernetesNavBar: Locator;
+  readonly title: Locator;
+
+  constructor(page: Page) {
+    this.page = page;
+    this.kubernetesNavBar = page.getByRole('navigation', { name: 'Kubernetes Navigation Bar' });
+    this.title = this.kubernetesNavBar.getByText('Kubernetes');
+  }
+
+  public async openTabPage(kubernetesResource: KubernetesResources): Promise<KubernetesResourcePage> {
+    const resource = this.kubernetesNavBar.getByRole('link', { name: kubernetesResource });
+    await resource.click();
+    return new KubernetesResourcePage(this.page, kubernetesResource);
+  }
+
+  public getSettingsNavBarTabLocator(name: string): Locator {
+    return this.kubernetesNavBar.getByLabel(name);
+  }
+}
diff --git a/tests/playwright/src/model/workbench/navigation.ts b/tests/playwright/src/model/workbench/navigation.ts
index dbc18801653..7d86e70bb05 100644
--- a/tests/playwright/src/model/workbench/navigation.ts
+++ b/tests/playwright/src/model/workbench/navigation.ts
@@ -18,12 +18,11 @@
 
 import { expect, type Locator, type Page } from '@playwright/test';
 
-import type { KubernetesResources } from '../core/types';
 import { ContainersPage } from '../pages/containers-page';
 import { DashboardPage } from '../pages/dashboard-page';
 import { ExtensionsPage } from '../pages/extensions-page';
 import { ImagesPage } from '../pages/images-page';
-import { KubernetesResourcePage } from '../pages/kubernetes-resource-page';
+import { KubernetesBar } from '../pages/kubernetes-bar';
 import { PodsPage } from '../pages/pods-page';
 import { SettingsBar } from '../pages/settings-bar';
 import { VolumesPage } from '../pages/volumes-page';
@@ -38,8 +37,7 @@ export class NavigationBar {
   readonly dashboardLink: Locator;
   readonly settingsLink: Locator;
   readonly extensionsLink: Locator;
-  readonly kubernetesButton: Locator;
-  readonly kubernetesResources: Locator;
+  readonly kubernetesLink: Locator;
 
   constructor(page: Page) {
     this.page = page;
@@ -51,8 +49,7 @@ export class NavigationBar {
     this.dashboardLink = this.page.getByRole('link', { name: 'Dashboard' });
     this.settingsLink = this.page.getByRole('link', { name: 'Settings' });
     this.extensionsLink = this.navigationLocator.getByRole('link', { name: 'Extensions', exact: true });
-    this.kubernetesButton = this.page.getByRole('button', { name: 'Open Kubernetes Resources Block' });
-    this.kubernetesResources = this.page.getByRole('region', { name: 'Kubernetes Resources' });
+    this.kubernetesLink = this.navigationLocator.getByRole('link', { name: 'Kubernetes' });
   }
 
   async openDashboard(): Promise<DashboardPage> {
@@ -94,15 +91,13 @@ export class NavigationBar {
     return new VolumesPage(this.page);
   }
 
-  async openKubernetesResources(name: KubernetesResources): Promise<KubernetesResourcePage> {
-    await expect(this.kubernetesButton).toBeEnabled();
-    if ((await this.kubernetesButton.getAttribute('aria-expanded')) === 'false') {
-      await this.kubernetesButton.click();
+  async openKubernetes(): Promise<KubernetesBar> {
+    const kubernetesBar = new KubernetesBar(this.page);
+    if (!(await kubernetesBar.kubernetesNavBar.isVisible())) {
+      await expect(this.kubernetesLink).toBeVisible();
+      await this.kubernetesLink.click({ timeout: 5000 });
     }
-    await expect(this.kubernetesResources).toBeVisible();
-    const resource = this.page.getByRole('link', { name: name });
-    await resource.click();
-    return new KubernetesResourcePage(this.page, name);
+    return new KubernetesBar(this.page);
   }
 
   async openExtensions(): Promise<ExtensionsPage> {
diff --git a/tests/playwright/src/specs/kubernetes.spec.ts b/tests/playwright/src/specs/kubernetes.spec.ts
index cef817ecb06..f260ee2b5fe 100644
--- a/tests/playwright/src/specs/kubernetes.spec.ts
+++ b/tests/playwright/src/specs/kubernetes.spec.ts
@@ -55,7 +55,8 @@ test.describe('Kubernetes resources End-to-End test', () => {
     'Tests suite should not run on Linux platform',
   );
   test('Kubernetes Nodes test', async ({ navigationBar }) => {
-    const nodesPage = await navigationBar.openKubernetesResources(KubernetesResources.Nodes);
+    const kubernetesBar = await navigationBar.openKubernetes();
+    const nodesPage = await kubernetesBar.openTabPage(KubernetesResources.Nodes);
     await playExpect(nodesPage.heading).toBeVisible();
     await playExpect(nodesPage.getResourceRowByName(KIND_NODE)).toBeVisible();