diff --git a/cypress/e2e/po/components/labeled-select.po.ts b/cypress/e2e/po/components/labeled-select.po.ts index 26786c36b76..b402b14120c 100644 --- 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 { + 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 index ce78fd59974..55f28378e40 100644 --- 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 new file mode 100644 index 00000000000..b10a126b1b1 --- /dev/null +++ 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 index d05c7d651df..a683df6c8c6 100644 --- 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 index 2ce8783998c..657f17357eb 100644 --- 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 index c7278d3527a..1a7a659cb17 100644 --- 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 index 78d6e956ea1..857fddaa6ad 100644 --- 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) => { - 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');