rancher · richard-cox · Dec 23, 2025
diff --git a/cypress/e2e/po/components/labeled-select.po.ts b/cypress/e2e/po/components/labeled-select.po.ts
@@ -53,6 +53,15 @@ export default class LabeledSelectPo extends ComponentPo {
     return this.self().get('.vs__dropdown-menu > li');
   }
 
+  /**
+   * As per `getOptions` but returns actual string values instead of elements
+   */
+  getOptionsAsStrings(): Cypress.Chainable<string[]> {
+    return this.getOptions().then((options) => {
+      return options.toArray().map((option) => option.textContent.trim());
+    });
+  }
+
   /**
    * Check dropdown is open
    * @returns

diff --git a/cypress/e2e/po/pages/extensions.po.ts b/cypress/e2e/po/pages/extensions.po.ts
@@ -1,5 +1,4 @@
 import PagePo from '@/cypress/e2e/po/pages/page.po';
-import LabeledSelectPo from '@/cypress/e2e/po/components/labeled-select.po';
 import TabbedPo from '@/cypress/e2e/po/components/tabbed.po';
 import ActionMenuPo from '@/cypress/e2e/po/components/action-menu.po';
 import NameNsDescriptionPo from '@/cypress/e2e/po/components/name-ns-description.po';
@@ -13,6 +12,7 @@ import ResourceTablePo from '@/cypress/e2e/po/components/resource-table.po';
 import { GetOptions } from '@/cypress/e2e/po/components/component.po';
 import RcItemCardPo from '@/cypress/e2e/po/components/rc-item-card.po';
 import TooltipPo from '@/cypress/e2e/po/components/tooltip.po';
+import InstallExtensionDialog from '@/cypress/e2e/po/prompts/installExtensionDialog.po';
 
 export default class ExtensionsPagePo extends PagePo {
   static url = '/c/local/uiplugins'
@@ -175,32 +175,8 @@ export default class ExtensionsPagePo extends PagePo {
   }
 
   // ------------------ extension install modal ------------------
-  extensionInstallModal() {
-    return this.self().get('[data-testid="install-extension-modal"]');
-  }
-
-  installModalSelectVersionLabel(label: string): Cypress.Chainable {
-    const selectVersion = new LabeledSelectPo(this.extensionInstallModal().getId('install-ext-modal-select-version'));
-
-    selectVersion.toggle();
-
-    return selectVersion.setOptionAndClick(label);
-  }
-
-  installModalSelectVersionClick(optionIndex: number): Cypress.Chainable {
-    const selectVersion = new LabeledSelectPo(this.extensionInstallModal().getId('install-ext-modal-select-version'));
-
-    selectVersion.toggle();
-
-    return selectVersion.clickOption(optionIndex);
-  }
-
-  installModalCancelClick(): Cypress.Chainable {
-    return this.extensionInstallModal().getId('install-ext-modal-cancel-btn').click();
-  }
-
-  installModalInstallClick(): Cypress.Chainable {
-    return this.extensionInstallModal().getId('install-ext-modal-install-btn').click();
+  installModal() {
+    return new InstallExtensionDialog();
   }
 
   // ------------------ extension uninstall modal ------------------

diff --git a/cypress/e2e/po/prompts/installExtensionDialog.po.ts b/cypress/e2e/po/prompts/installExtensionDialog.po.ts
@@ -0,0 +1,35 @@
+import DialogPo from '@/cypress/e2e/po/components/dialog.po';
+import AsyncButtonPo from '~/cypress/e2e/po/components/async-button.po';
+import LabeledSelectPo from '~/cypress/e2e/po/components/labeled-select.po';
+
+export default class InstallExtensionDialog extends DialogPo {
+  public versionLabelSelect() {
+    return new LabeledSelectPo(this.self().getId('install-ext-modal-select-version'));
+  }
+
+  selectVersionLabel(label: string): Cypress.Chainable {
+    const selectVersion = this.versionLabelSelect();
+
+    selectVersion.toggle();
+
+    return selectVersion.setOptionAndClick(label);
+  }
+
+  selectVersionClick(optionIndex: number, toggle = true): Cypress.Chainable {
+    const selectVersion = this.versionLabelSelect();
+
+    if (toggle) {
+      selectVersion.toggle();
+    }
+
+    return selectVersion.clickOption(optionIndex);
+  }
+
+  cancelButton() {
+    return this.self().getId('install-ext-modal-cancel-btn');
+  }
+
+  installButton() {
+    return new AsyncButtonPo(this.self().getId('install-ext-modal-install-btn'));
+  }
+}
diff --git a/cypress/e2e/tests/extensions/elemental/elemental.spec.ts b/cypress/e2e/tests/extensions/elemental/elemental.spec.ts
@@ -50,11 +50,11 @@ describe('Extensions Compatibility spec', { tags: ['@elemental', '@adminUser'] }
 
     // click on install button on card
     extensionsPo.extensionCardInstallClick(EXTENSION_NAME);
-    extensionsPo.extensionInstallModal().should('be.visible');
+    extensionsPo.installModal().checkVisible();
 
     // select version and click install
-    extensionsPo.installModalSelectVersionLabel(EXTENSION_VERSION);
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().selectVersionLabel(EXTENSION_VERSION);
+    extensionsPo.installModal().installButton().click();
 
     // let's check the extension reload banner and reload the page
     extensionsPo.extensionReloadBanner().should('be.visible', MEDIUM_TIMEOUT_OPT);

diff --git a/cypress/e2e/tests/pages/extensions/extensions.spec.ts b/cypress/e2e/tests/pages/extensions/extensions.spec.ts
@@ -303,11 +303,11 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // click on install button on card
     extensionsPo.extensionCardInstallClick(EXTENSION_NAME);
-    extensionsPo.extensionInstallModal().should('be.visible');
+    extensionsPo.installModal().checkVisible();
 
     // select version and click install
-    extensionsPo.installModalSelectVersionClick(2);
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().selectVersionClick(2);
+    extensionsPo.installModal().installButton().click();
     cy.wait('@installExtension').its('response.statusCode').should('eq', 201);
 
     // let's check the extension reload banner and reload the page
@@ -351,7 +351,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // click on update button on card
     extensionsPo.extensionCardUpgradeClick(EXTENSION_NAME);
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().installButton().click();
     cy.wait('@upgradeExtension').its('response.statusCode').should('eq', 201);
 
     // let's check the extension reload banner and reload the page
@@ -377,7 +377,7 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
     // click on the downgrade button on card
     // this will downgrade to the immediate previous version
     extensionsPo.extensionCardDowngradeClick(EXTENSION_NAME);
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().installButton().click();
 
     // let's check the extension reload banner and reload the page
     extensionsPo.extensionReloadBanner().should('be.visible');
@@ -401,10 +401,10 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // click on install button on card
     extensionsPo.extensionCardInstallClick(DISABLED_CACHE_EXTENSION_NAME);
-    extensionsPo.extensionInstallModal().should('be.visible');
+    extensionsPo.installModal().checkVisible();
 
     // click install
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().installButton().click();
 
     // let's check the extension reload banner and reload the page
     extensionsPo.extensionReloadBanner().should('be.visible');
@@ -450,8 +450,8 @@ describe('Extensions page', { tags: ['@extensions', '@adminUser'] }, () => {
 
     // Install unauthenticated extension
     extensionsPo.extensionCardInstallClick(UNAUTHENTICATED_EXTENSION_NAME);
-    extensionsPo.extensionInstallModal().should('be.visible');
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().checkVisible();
+    extensionsPo.installModal().installButton().click();
 
     // let's check the extension reload banner and reload the page
     extensionsPo.extensionReloadBanner().should('be.visible');

diff --git a/cypress/e2e/tests/pages/extensions/kubewarden.spec.ts b/cypress/e2e/tests/pages/extensions/kubewarden.spec.ts
@@ -40,10 +40,10 @@ describe('Kubewarden Extension', { tags: ['@extensions', '@adminUser'] }, () =>
 
     // click on install button on card
     extensionsPo.extensionCardInstallClick(extensionName);
-    extensionsPo.extensionInstallModal().should('be.visible' );
+    extensionsPo.installModal().checkVisible();
 
     // click install
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().installButton().click();
 
     // check the extension reload banner and reload the page
     extensionsPo.extensionReloadBanner().should('be.visible');

diff --git a/cypress/e2e/tests/pages/virtualization-mgmt/harvester.spec.ts b/cypress/e2e/tests/pages/virtualization-mgmt/harvester.spec.ts
@@ -156,11 +156,11 @@ describe('Harvester', { tags: ['@virtualizationMgmt', '@adminUser'] }, () => {
 
     // click on install button on card
     extensionsPo.extensionCardInstallClick(harvesterTitle);
-    extensionsPo.extensionInstallModal().should('be.visible');
+    extensionsPo.installModal().checkVisible();
 
     // select latest version and click install
-    extensionsPo.installModalSelectVersionClick(1);
-    extensionsPo.installModalInstallClick();
+    extensionsPo.installModal().selectVersionClick(1);
+    extensionsPo.installModal().installButton().click();
     cy.wait('@installHarvesterExtension').its('response.statusCode').should('eq', 201);
     extensionsPo.waitForPage(null, 'installed');
 
@@ -225,21 +225,18 @@ describe('Harvester', { tags: ['@virtualizationMgmt', '@adminUser'] }, () => {
     extensionsPo.waitForPage(null, 'available', MEDIUM_TIMEOUT_OPT);
     extensionsPo.loading().should('not.exist');
 
-    // get harvester extension versions
-    cy.getRancherResource('v1', 'catalog.cattle.io.clusterrepos/harvester?link=index').then((resp: Cypress.Response<any>) => {
-      const fetchedVersions = resp?.body.entries.harvester.map((item: any) => item.version);
-
-      cy.wrap(fetchedVersions).as('harvesterVersions');
-    });
-
     // click on install button on card
     extensionsPo.extensionCardInstallClick(harvesterTitle);
-    extensionsPo.extensionInstallModal().should('be.visible');
+    extensionsPo.installModal().checkVisible();
+
+    // Note - We can't fetch version from `catalog.cattle.io.clusterrepos/harvester?link=index` given it won't filter out invalid extensions
+    // for example in rancher 2.12 the harvester 1.7.0 extension is invalid... however still returned... resulting in expected versions that don't exist as valid options
 
-    cy.get('@harvesterVersions').then((versions) => {
+    extensionsPo.installModal().versionLabelSelect().toggle();
+    extensionsPo.installModal().versionLabelSelect().getOptionsAsStrings().then((versions) => {
       // select older version and click install
-      extensionsPo.installModalSelectVersionClick(2);
-      extensionsPo.installModalInstallClick();
+      extensionsPo.installModal().selectVersionClick(2, false);
+      extensionsPo.installModal().installButton().click();
       cy.wait('@installHarvesterExtension').its('response.statusCode').should('eq', 201);
       extensionsPo.waitForPage(null, 'installed');