Fix delay when navigating to a cluster

.github/workflows/test.yaml

@@ -139,7 +139,9 @@ jobs:
           cp -r cypress/screenshots artifacts 2>/dev/null || :
           cp -r cypress/videos artifacts 2>/dev/null || :
           cp -r cypress/reports/* artifacts || :
+          ls -la ${{ env.E2E_RANCHER_LOG }} || echo ${{ env.E2E_RANCHER_LOG }} not found
           cp ${{ env.E2E_RANCHER_LOG }} artifacts/rancher.logs 2>/dev/null || :
+          ls -la browser-logs/out.html || echo browser-logs/out.html not found
           cp browser-logs/out.html artifacts/browser-logs.html 2>/dev/null || :
 
       - name: Upload Artifacts

cypress/base-config.ts

@@ -2,6 +2,7 @@
 import { defineConfig } from 'cypress';
 import websocketTasks from './support/utils/webSocket-utils';
 import path from 'path';
+import fs from 'fs';
 const { removeDirectory } = require('cypress-delete-downloads-folder');
 const { beforeRunHook, afterRunHook } = require('cypress-mochawesome-reporter/lib');
 
@@ -168,6 +169,32 @@ const baseConfig = defineConfig({
 
         // Done this way to catch errors when there are no tests run
         on('after:run', async() => {
+          // We need to wait for the cypress-terminal-report plugin to finish writing the browser logs
+          // There's a race condition where the mochawesome afterRunHook can finish and exit the process
+          // before the terminal report is written.
+          const logFile = path.join(config.projectRoot, 'browser-logs', 'out.html');
+          const timeout = 5000; // 5 seconds
+          const interval = 100; // 100 ms
+          let waited = 0;
+          const fileExists = () => {
+            try {
+              return fs.existsSync(logFile);
+            } catch (e) {
+              return false;
+            }
+          };
+
+          const wait = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
+
+          while (waited < timeout && !fileExists()) {
+            await wait(interval);
+            waited += interval;
+          }
+
+          if (!fileExists()) {
+            console.warn(`\n\n⚠️  Browser log file not found at ${ logFile } after ${ timeout }ms. Proceeding without it.\n\n`);
+          }
+
           try {
             await afterRunHook();
           } catch (error) {

cypress/e2e/po/components/namespace-filter.po.ts

@@ -6,6 +6,8 @@ export class NamespaceFilterPo extends ComponentPo {
   }
 
   toggle() {
+    this.namespaceDropdown().should('be.visible');
+
     return this.namespaceDropdown().click({ force: true });
   }
 

cypress/e2e/po/pages/explorer/cluster-dashboard.po.ts

@@ -7,6 +7,7 @@ import { HeaderPo } from '@/cypress/e2e/po/components/header.po';
 import { NamespaceFilterPo } from '@/cypress/e2e/po/components/namespace-filter.po';
 import ResourceTablePo from '~/cypress/e2e/po/components/resource-table.po';
 import ActionMenuPo from '@/cypress/e2e/po/components/action-menu-shell.po';
+import { MEDIUM_TIMEOUT_OPT } from '@/cypress/support/utils/timeouts';
 
 export default class ClusterDashboardPagePo extends PagePo {
   private static createPath(clusterId: string) {
@@ -118,7 +119,7 @@ export default class ClusterDashboardPagePo extends PagePo {
 
     instance.goTo();
     instance.waitForPage();
-    nsfilter.checkVisible();
+    nsfilter.checkVisible(MEDIUM_TIMEOUT_OPT);
 
     if (nsProject) {
       for (let i = 0; i < nsProject.values.length; i++) {

cypress/e2e/po/pages/extensions.po.ts

@@ -86,7 +86,7 @@ export default class ExtensionsPagePo extends PagePo {
     cy.intercept('POST', `${ CLUSTER_REPOS_BASE_URL }/${ clusterRepoName }?action=install`).as(interceptAlias);
 
     this.extensionTabAvailableClick();
-    this.waitForPage(null, 'available');
+    this.waitForPage(undefined, 'available');
     this.extensionCardInstallClick(extensionName);
     this.installModal().checkVisible();
     this.installModal().installButton().click();
@@ -106,7 +106,7 @@ export default class ExtensionsPagePo extends PagePo {
     cy.intercept('GET', `${ CLUSTER_REPOS_BASE_URL }?*`).as('getRepos');
 
     // we should be on the extensions page
-    this.waitForPage(null, 'available');
+    this.waitForPage(undefined, 'available', MEDIUM_TIMEOUT_OPT);
     this.loading().should('not.exist');
 
     // go to app repos
@@ -259,6 +259,8 @@ export default class ExtensionsPagePo extends PagePo {
 
   // ------------------ extension tabs ------------------
   extensionTabInstalledClick(): Cypress.Chainable {
+    this.waitForTabs();
+
     return this.extensionTabs.clickTabWithName('installed');
   }
 

cypress/e2e/tests/accessibility/shell.spec.ts

@@ -691,10 +691,10 @@ describe('Shell a11y testing', { tags: ['@adminUser', '@accessibility'] }, () =>
         cy.setUserPreference({ 'plugin-developer': true });
 
         extensionsPo.goTo();
-        extensionsPo.waitForPage(null, 'available');
+        extensionsPo.waitForPage(undefined, 'available');
         extensionsPo.loading().should('not.exist');
         extensionsPo.extensionTabBuiltinClick();
-        extensionsPo.waitForPage(null, 'builtin');
+        extensionsPo.waitForPage(undefined, 'builtin');
         extensionsPo.extensionCard('AKS Provisioning').checkVisible();
         cy.injectAxe();
 

cypress/e2e/tests/components/yaml-editor.spec.ts

@@ -19,6 +19,7 @@ describe('Yaml Editor', () => {
 
     // Create a new deployment resource
     deploymentsCreatePage.goTo();
+    deploymentsCreatePage.waitForPage();
     cy.intercept('POST', '/v1/apps.deployments').as('createDeployment');
     deploymentsCreatePage.createWithUI(name, containerImage, namespace);
     cy.wait('@createDeployment').its('response.statusCode').should('eq', 201);
@@ -27,6 +28,7 @@ describe('Yaml Editor', () => {
   describe('Edit mode', () => {
     it('Check if body and footer are visible to human eye', { tags: ['@components', '@adminUser'] }, () => {
       deploymentsListPage.goTo();
+      deploymentsListPage.waitForPage();
       deploymentsListPage.listElementWithName(name).should('exist');
       deploymentsListPage.goToEditYamlPage(name);
 
@@ -41,6 +43,8 @@ describe('Yaml Editor', () => {
   afterEach(() => {
     // Delete the deployment
     deploymentsListPage.goTo();
+    deploymentsListPage.waitForPage();
+    deploymentsListPage.list().checkVisible();
     deploymentsListPage.deleteItemWithUI(name);
   });
 });

cypress/e2e/tests/pages/extensions/extensions.spec.ts

@@ -30,16 +30,16 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // With no extensions installed, should default to "Available"
     extensionsPo.goTo();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
 
     // Preserve active tab on reload
     cy.setUserPreference({ 'plugin-developer': true });
     extensionsPo.goTo(); // reload to get pref
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.extensionTabBuiltinClick();
-    extensionsPo.waitForPage(null, 'builtin');
+    extensionsPo.waitForPage(undefined, 'builtin');
     cy.reload();
-    extensionsPo.waitForPage(null, 'builtin');
+    extensionsPo.waitForPage(undefined, 'builtin');
     cy.setUserPreference({ 'plugin-developer': false });
   });
 
@@ -49,21 +49,21 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     cy.setUserPreference({ 'plugin-developer': false });
     extensionsPo.goTo();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
 
     // Should not be able to see the built-in tab
     extensionsPo.extensionTabBuiltin().checkNotExists();
 
     // Set the preference
     cy.setUserPreference({ 'plugin-developer': true });
     extensionsPo.goTo();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
 
     // Reload
     extensionsPo.extensionTabBuiltin().checkExists();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.extensionTabBuiltinClick();
-    extensionsPo.waitForPage(null, 'builtin');
+    extensionsPo.waitForPage(undefined, 'builtin');
 
     // AKS Provisioning
     extensionsPo.extensionCardVersion('AKS Provisioning').should('contain', pluginVersion);
@@ -188,7 +188,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     extensionsPo.goTo();
 
-    // check if burguer menu nav is highlighted correctly for extensions
+    // check if burger menu nav is highlighted correctly for extensions
     // https://github.com/rancher/dashboard/issues/10010
     BurgerMenuPo.checkIfMenuItemLinkIsHighlighted('Extensions');
 
@@ -275,7 +275,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.goTo();
 
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
 
     // we should be on the extensions page
     extensionsPo.waitForTitle();
@@ -308,7 +308,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
 
     // click on install button on card
     extensionsPo.extensionCardInstallClick(EXTENSION_NAME);
@@ -324,7 +324,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.extensionReloadClick();
 
     // make sure we land on the installed tab by default
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
 
     // make sure extension card is in the installed tab
     extensionsPo.extensionCardClick(EXTENSION_NAME);
@@ -339,12 +339,12 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // check for installed extension in "installed" tab
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
     extensionsPo.extensionCard(EXTENSION_NAME).checkVisible();
 
     // check for installed extension in "available" tab
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     cy.contains(`[data-testid="extension-card-${ EXTENSION_NAME }"]`).should('not.exist');
   });
 
@@ -356,7 +356,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
 
     // click on update button on card
     extensionsPo.extensionCardUpgradeClick(EXTENSION_NAME);
@@ -370,7 +370,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     // make sure extension card is still on the installed tab
     // since we installed the latest version
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
     extensionsPo.extensionCard(EXTENSION_NAME).checkVisible();
   });
 
@@ -381,7 +381,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
 
     // click on the downgrade button on card
     // this will downgrade to the immediate previous version
@@ -394,7 +394,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // make sure extension card is on the installed tab and is visible
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
     extensionsPo.extensionCard(EXTENSION_NAME).checkVisible();
   });
 
@@ -406,7 +406,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.loading().should('not.exist');
 
     // Wait for the large-extension card to appear before interacting
@@ -425,7 +425,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // make sure extension card is in the installed tab
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
     extensionsPo.extensionCardClick(DISABLED_CACHE_EXTENSION_NAME);
     extensionsPo.extensionDetailsTitle().should('contain', DISABLED_CACHE_EXTENSION_NAME);
     extensionsPo.extensionDetailsCloseClick();
@@ -458,7 +458,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.loading().should('not.exist');
 
     // Install unauthenticated extension
@@ -469,7 +469,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     // let's check the extension reload banner and reload the page
     extensionsPo.extensionReloadBanner().should('be.visible');
     extensionsPo.extensionReloadClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
     extensionsPo.loading().should('not.exist');
 
     // make sure both extensions have been imported
@@ -489,7 +489,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     // make sure both extensions have been imported after logging in again
     cy.login(undefined, undefined, false);
     extensionsPo.goTo();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
     extensionsPo.loading().should('not.exist');
     extensionsPo.waitForTitle();
     extensionsPo.extensionScriptImport(UNAUTHENTICATED_EXTENSION_NAME).should('exist');
@@ -505,7 +505,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
 
     // click on uninstall button on card
     extensionsPo.extensionCardUninstallClick(EXTENSION_NAME);
@@ -519,7 +519,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // make sure extension card is in the available tab
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.extensionCardClick(EXTENSION_NAME);
     extensionsPo.extensionDetailsTitle().should('contain', EXTENSION_NAME);
   });
@@ -533,7 +533,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
 
     // click on uninstall button on card
     extensionsPo.extensionCardUninstallClick(UNAUTHENTICATED_EXTENSION_NAME);
@@ -547,7 +547,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // make sure extension card is in the available tab
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.extensionCardClick(UNAUTHENTICATED_EXTENSION_NAME);
     extensionsPo.extensionDetailsTitle().should('contain', UNAUTHENTICATED_EXTENSION_NAME);
   });
@@ -561,7 +561,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     extensionsPo.waitForPage();
 
     extensionsPo.extensionTabInstalledClick();
-    extensionsPo.waitForPage(null, 'installed');
+    extensionsPo.waitForPage(undefined, 'installed');
 
     // click on uninstall button on card
     extensionsPo.extensionCardUninstallClick(DISABLED_CACHE_EXTENSION_NAME);
@@ -574,7 +574,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // make sure extension card is in the available tab
     extensionsPo.extensionTabAvailableClick();
-    extensionsPo.waitForPage(null, 'available');
+    extensionsPo.waitForPage(undefined, 'available');
     extensionsPo.extensionCardClick(DISABLED_CACHE_EXTENSION_NAME);
     extensionsPo.extensionDetailsTitle().should('contain', DISABLED_CACHE_EXTENSION_NAME);
   });

cypress/e2e/tests/pages/extensions/kubewarden.spec.ts

@@ -13,7 +13,7 @@ let removeExtensions = false;
 function verifyKubewardenInstalledDetails(extensionsPo: ExtensionsPagePo) {
   extensionsPo.waitForTabs();
   extensionsPo.extensionTabInstalledClick();
-  extensionsPo.waitForPage(null, 'installed');
+  extensionsPo.waitForPage(undefined, 'installed');
   extensionsPo.extensionCardClick(extensionName);
   extensionsPo.extensionDetailsTitle().should('contain', extensionName);
   extensionsPo.extensionDetailsCloseClick();
@@ -55,7 +55,7 @@ describe('Kubewarden Extension', { tags: ['@extensions', '@adminUser'] }, () =>
         return;
       }
       extensionsPo.extensionTabInstalledClick();
-      extensionsPo.waitForPage(null, 'installed');
+      extensionsPo.waitForPage(undefined, 'installed');
       extensionsPo.checkForExtensionCardWithName(extensionName).then((kubewardenCardPresent) => {
         if (kubewardenCardPresent) {
           extensionsPo.extensionCardClick(extensionName);