update monitoring/istio tests

cypress/e2e/blueprints/charts/prometheus-chart.ts

@@ -6,11 +6,9 @@ export const prometheusSpec = {
   values:      {
     prometheus: {
       prometheusSpec: {
-        evaluationInterval: '1m',
-        resources:          { requests: { memory: '1750Mi' } },
-        retentionSize:      '50GiB',
-        scrapeInterval:     '1m',
-        storageSpec:        {
+        resources:     { requests: { memory: '1750Mi' } },
+        retentionSize: '50GiB',
+        storageSpec:   {
           volumeClaimTemplate: {
             spec: {
               accessModes: [

cypress/e2e/po/components/checkbox-input.po.ts

@@ -16,7 +16,10 @@ export default class CheckboxInputPo extends ComponentPo {
    * @returns
    */
   set(): Cypress.Chainable {
-    return this.self().find('.checkbox-custom').click();
+    return this.self()
+      .find('.checkbox-custom')
+      .should('not.be.disabled') // check to ensure checkbox is ready to be clicked
+      .click();
   }
 
   /**

cypress/e2e/po/components/radio-group-input.po.ts

@@ -23,4 +23,21 @@ export default class RadioGroupInputPo extends ComponentPo {
   isChecked(value: number) {
     return this.self().find('.radio-container > span').eq(value).then(($el) => expect($el).have.attr('aria-checked', 'true'));
   }
+
+  /**
+   * Get all radio options from a given group
+   * @returns
+   */
+  getAllOptions(): Cypress.Chainable {
+    return this.self().find('.radio-label');
+  }
+
+  /**
+   * Get radio option by index
+   * @param index
+   * @returns
+   */
+  getOptionByIndex(index: number): Cypress.Chainable {
+    return this.self().find('.radio-label').eq(index);
+  }
 }

cypress/e2e/po/pages/explorer/charts/chart.po.ts

@@ -2,6 +2,7 @@ import PagePo from '@/cypress/e2e/po/pages/page.po';
 import AsyncButtonPo from '@/cypress/e2e/po/components/async-button.po';
 import { ChartsPage } from '@/cypress/e2e/po/pages/explorer/charts/charts.po';
 import BannersPo from '@/cypress/e2e/po/components/banners.po';
+import { MEDIUM_TIMEOUT_OPT } from '@/cypress/support/utils/timeouts';
 
 export class ChartPage extends PagePo {
   private static createPath(clusterId: string) {
@@ -38,6 +39,7 @@ export class ChartPage extends PagePo {
   goToInstall() {
     const btn = new AsyncButtonPo('.chart-header .btn.role-primary');
 
+    btn.checkVisible(MEDIUM_TIMEOUT_OPT);
     btn.click(true);
 
     return this;
@@ -51,6 +53,10 @@ export class ChartPage extends PagePo {
     return this.self().find('[data-testid="chart-version-link"]').contains(version).click();
   }
 
+  checkSelectedVersion(version: string) {
+    return this.self().find('.chart-body__info-section--versions').find('.current-version').contains(version);
+  }
+
   versions() {
     return this.self().find('[data-testid="chart-versions"]');
   }
@@ -70,4 +76,14 @@ export class ChartPage extends PagePo {
   keywords() {
     return this.self().find('[data-testid="chart-keyword-link"]');
   }
+
+  /**
+   * Get all versions of the chart
+   * @returns Array of versions
+   */
+  getVersions() {
+    return this.self().find('.chart-body__info-section--versions').find('b').then((elements) => {
+      return Cypress._.map(elements, 'innerText');
+    });
+  }
 }

cypress/e2e/po/pages/explorer/charts/tabs/alerting-tab.po.ts

@@ -7,6 +7,6 @@ export class AlertingTab extends MonitoringTab {
   }
 
   deployCheckbox(): CheckboxInputPo {
-    return new CheckboxInputPo(cy.get('[aria-label="Deploy Alertmanager"]').parent().parent());
+    return CheckboxInputPo.byLabel(this.self(), 'Deploy Alertmanager');
   }
 }

cypress/e2e/po/pages/explorer/charts/tabs/grafana-tab.po.ts

@@ -1,12 +1,17 @@
 import ComponentPo from '@/cypress/e2e/po/components/component.po';
 import LabeledInputPo from '@/cypress/e2e/po/components/labeled-input.po';
 import RadioGroupInputPo from '@/cypress/e2e/po/components/radio-group-input.po';
+import LabeledSelectPo from '@/cypress/e2e/po/components/labeled-select.po';
 
 export class GrafanaTab extends ComponentPo {
   constructor(selector = '.dashboard-root') {
     super(selector);
   }
 
+  tabID(): string {
+    return 'grafana';
+  }
+
   requestedCpu(): LabeledInputPo {
     return new LabeledInputPo('[data-testid="input-grafana-requests-cpu"]');
   }
@@ -24,14 +29,18 @@ export class GrafanaTab extends ComponentPo {
   }
 
   storageOptions(): RadioGroupInputPo {
-    return new RadioGroupInputPo('[data-testid="radio-group-input-grafana-storage"');
+    return new RadioGroupInputPo('[data-testid="radio-group-input-grafana-storage"]');
+  }
+
+  storageClass(): LabeledSelectPo {
+    return new LabeledSelectPo('[data-testid="select-chart-grafana-storage-class"]');
   }
 
   storagePvcSizeInput(): LabeledInputPo {
-    return new LabeledInputPo('[data-testid="grafana-storage-pvc-size"');
+    return new LabeledInputPo('[data-testid="grafana-storage-pvc-size"]');
   }
 
   storageStatefulsetSizeInput(): LabeledInputPo {
-    return new LabeledInputPo('[data-testid="grafana-storage-statefulset-size"');
+    return new LabeledInputPo('[data-testid="grafana-storage-statefulset-size"]');
   }
 }

cypress/e2e/po/pages/explorer/charts/tabs/istio-tab.po.ts

@@ -7,6 +7,6 @@ export class IstioTab extends MonitoringTab {
   }
 
   enableIngressGatewayCheckbox(): CheckboxInputPo {
-    return new CheckboxInputPo(cy.get('[aria-label="Enable Ingress Gateway"]').parent().parent());
+    return CheckboxInputPo.byLabel(this.self(), 'Enable Ingress Gateway');
   }
 }

cypress/e2e/tests/pages/charts/logging.spec.ts

@@ -3,7 +3,7 @@ import HomePagePo from '@/cypress/e2e/po/pages/home.po';
 import { InstallChartPage } from '@/cypress/e2e/po/pages/explorer/charts/install-charts.po';
 import ProductNavPo from '@/cypress/e2e/po/side-bars/product-side-nav.po';
 import { LoggingClusterOutputCreateEditPagePo, LoggingClusteroutputListPagePo } from '@/cypress/e2e/po/other-products/logging/logging-clusteroutput.po';
-import { LoggingClusterFlowCreateEditPagePo, LoggingClusterFlowDetailPagePo, LoggingClusterFlowListPagePo } from '@/cypress/e2e/po/other-products/logging/logging-clusterflow-po';
+import { LoggingClusterFlowCreateEditPagePo, LoggingClusterFlowDetailPagePo, LoggingClusterFlowListPagePo } from '@/cypress/e2e/po/other-products/logging/logging-clusterflow.po';
 import Kubectl from '@/cypress/e2e/po/components/kubectl.po';
 import ClusterToolsPagePo from '@/cypress/e2e/po/pages/explorer/cluster-tools.po';
 import PromptRemove from '@/cypress/e2e/po/prompts/promptRemove.po';

cypress/e2e/tests/pages/charts/monitoring-istio.spec.ts

@@ -1,296 +1,306 @@
-// import Kubectl from '@/cypress/e2e/po/components/kubectl.po';
-// import TabbedPo from '@/cypress/e2e/po/components/tabbed.po';
-// import ClusterDashboardPagePo from '@/cypress/e2e/po/pages/explorer/cluster-dashboard.po';
-// import ProductNavPo from '@/cypress/e2e/po/side-bars/product-side-nav.po';
-// import { prometheusSpec } from '@/cypress/e2e/blueprints/charts/prometheus-chart';
-// import HomePagePo from '@/cypress/e2e/po/pages/home.po';
-// import { ChartPage } from '@/cypress/e2e/po/pages/explorer/charts/chart.po';
-// import { ChartsPage } from '@/cypress/e2e/po/pages/explorer/charts/charts.po';
-// import { InstallChartPage } from '@/cypress/e2e/po/pages/explorer/charts/install-charts.po';
-// import { PrometheusTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/prometheus-tab.po';
-// import { GrafanaTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/grafana-tab.po';
-// import { AlertingTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/alerting-tab.po';
-// import { IstioTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/istio-tab.po';
-// import { LONG_TIMEOUT_OPT } from '~/cypress/support/utils/timeouts';
-// import { DEFAULT_GRAFANA_STORAGE_SIZE } from '@shell/config/types.js';
+import Kubectl from '@/cypress/e2e/po/components/kubectl.po';
+import TabbedPo from '@/cypress/e2e/po/components/tabbed.po';
+import { prometheusSpec } from '@/cypress/e2e/blueprints/charts/prometheus-chart';
+import { ChartPage } from '@/cypress/e2e/po/pages/explorer/charts/chart.po';
+import { ChartsPage } from '@/cypress/e2e/po/pages/explorer/charts/charts.po';
+import { InstallChartPage } from '@/cypress/e2e/po/pages/explorer/charts/install-charts.po';
+import { PrometheusTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/prometheus-tab.po';
+import { GrafanaTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/grafana-tab.po';
+import { AlertingTab } from '@/cypress/e2e/po/pages/explorer/charts/tabs/alerting-tab.po';
+import { LONG_TIMEOUT_OPT, MEDIUM_TIMEOUT_OPT } from '@/cypress/support/utils/timeouts';
+import { DEFAULT_GRAFANA_STORAGE_SIZE } from '@shell/config/types.js';
+import ChartInstalledAppsListPagePo from '@/cypress/e2e/po/pages/chart-installed-apps.po';
 
-describe('[Vue3 Skip]: [Placeholder]: Charts', { tags: ['@charts', '@adminUser'] }, () => {
-  it('every file must have a test...', () => {});
+describe('Charts', { tags: ['@charts', '@adminUser'] }, () => {
+  const chartsPage = new ChartsPage();
+  const chartPage = new ChartPage();
+  const installChart = new InstallChartPage();
+  const terminal = new Kubectl();
+  const prometheus = new PrometheusTab();
+  const alerting = new AlertingTab();
+  const chartInstalledAppsListPage = new ChartInstalledAppsListPagePo('local', 'apps');
+
+  before(() => {
+    cy.login();
+    cy.viewport(1280, 720);
+  });
+
+  after(() => {
+    uninstallApp('cattle-monitoring-system', 'rancher-monitoring-crd');
+    uninstallApp('cattle-monitoring-system', 'rancher-monitoring');
+  });
+
+  function uninstallApp(namespace: string, name: string) {
+    cy.createRancherResource('v1', `catalog.cattle.io.apps/${ namespace }/${ name }?action=uninstall`, '{}');
+    // Need to wait between uninstalls (not ideal)
+    cy.wait(2000); // eslint-disable-line cypress/no-unnecessary-waiting
+  }
+
+  describe('Monitoring', { testIsolation: 'off' }, () => {
+    describe('Prometheus local provisioner config', () => {
+      const provisionerVersion = 'v0.0.24';
+      const storageClass = 'local-path';
+
+      before(() => {
+        ChartsPage.navTo();
+        chartsPage.waitForPage();
+
+        // Open terminal
+        terminal.openTerminal(LONG_TIMEOUT_OPT);
+
+        // kubectl commands
+        terminal.executeCommand(`apply -f https://raw.githubusercontent.com/rancher/local-path-provisioner/${ provisionerVersion }/deploy/local-path-storage.yaml`)
+          .executeCommand('create -f https://raw.githubusercontent.com/rancher/local-path-provisioner/master/examples/pvc/pvc.yaml')
+          .executeCommand('create -f https://raw.githubusercontent.com/rancher/local-path-provisioner/master/examples/pod/pod.yaml');
+
+        terminal.closeTerminal();
+      });
+
+      beforeEach(() => {
+        cy.intercept('POST', 'v1/catalog.cattle.io.clusterrepos/rancher-charts?action=install').as('prometheusChartCreation');
+      });
+
+      it('Prometheus and Grafana should have all relavant storage options and Storage Class inputs', () => {
+        const tabbedOptions = new TabbedPo();
+
+        ChartPage.navTo(null, 'Monitoring');
+        chartPage.waitForChartPage('rancher-charts', 'rancher-monitoring');
+        chartPage.goToInstall();
+        installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        // Check Grafana has all storage options: https://github.com/rancher/dashboard/issues/11540
+        const grafana = new GrafanaTab();
+
+        installChart.nextPage().selectTab(tabbedOptions, grafana.tabID());
+        installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+        grafana.storageOptions().getAllOptions().should('have.length', 4);
+        grafana.storageOptions().isChecked(0); // Disabled by default
+
+        const options = ['Disabled', 'Enable With Existing PVC', 'Enable with PVC Template', 'Enable with StatefulSet Template'];
+
+        options.forEach((option, index) => {
+          grafana.storageOptions().getOptionByIndex(index).should('have.text', option);
+        });
+
+        // Check Grafana has storage class input: https://github.com/rancher/dashboard/issues/11539
+        grafana.storageOptions().set(2);
+        grafana.storageClass().checkExists();
+        grafana.storageClass().toggle();
+        grafana.storageClass().clickOptionWithLabel(storageClass);
+        grafana.storageClass().checkOptionSelected(storageClass);
+
+        grafana.storageOptions().set(3);
+        grafana.storageClass().checkExists();
+        grafana.storageClass().toggle();
+        grafana.storageClass().clickOptionWithLabel(storageClass);
+        grafana.storageClass().checkOptionSelected(storageClass);
+
+        // Check Prometheus has storage class input: https://github.com/rancher/dashboard/issues/11539
+        installChart.selectTab(tabbedOptions, prometheus.tabID());
+        installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        prometheus.scrollToTabBottom();
+
+        prometheus.persistentStorage().checkVisible();
+        prometheus.persistentStorage().set();
+
+        prometheus.storageClass().checkExists();
+        prometheus.storageClass().toggle();
+        prometheus.storageClass().clickOptionWithLabel(storageClass);
+        prometheus.storageClass().checkOptionSelected(storageClass);
+      });
+
+      it('Should not include empty prometheus selector when installing.', () => {
+        ChartPage.navTo(null, 'Monitoring');
+
+        chartPage.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        const tabbedOptions = new TabbedPo();
+
+        // Get versions
+        chartPage.getVersions().then((versions) => {
+          const truncatedVersion = versions[0].substring(0, versions[0].indexOf('-rancher'));
+
+          // Check latest selected by default
+          chartPage.checkSelectedVersion(truncatedVersion);
+
+          // Navigate to the edit options page and Set prometheus storage class
+          chartPage.goToInstall();
+          installChart.nextPage().selectTab(tabbedOptions, prometheus.tabID());
+
+          installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+          // Scroll into view
+          prometheus.persistentStorage().checkVisible();
+          prometheus.persistentStorage().set();
+
+          // to check custom box element width and height in order to prevent regression
+          // https://github.com/rancher/dashboard/issues/10000
+          prometheus.persistentStorage().hasAppropriateWidth();
+          prometheus.persistentStorage().hasAppropriateHeight();
+
+          // Scroll into view
+          prometheus.storageClass().checkVisible();
+          prometheus.storageClass().toggle();
+          prometheus.storageClass().clickOptionWithLabel(storageClass);
+
+          // Disable installing Alert Manager
+          installChart.selectTab(tabbedOptions, alerting.tabID());
+
+          installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+          alerting.deployCheckbox().checkVisible();
+          alerting.deployCheckbox().set();
+
+          // Click on YAML. In YAML mode, the prometheus selector is present but empty
+          // It should not be sent to the API
+          installChart.editYaml();
+
+          installChart.installChart();
+
+          cy.wait('@prometheusChartCreation', { requestTimeout: 10000 }).then((req) => {
+            const monitoringChart = req.request?.body.charts.find((chart: any) => chart.chartName === 'rancher-monitoring');
+
+            expect(monitoringChart.values.prometheus).to.deep.equal(prometheusSpec.values.prometheus);
+          });
+
+          chartInstalledAppsListPage.waitForPage(null, null, MEDIUM_TIMEOUT_OPT);
+          terminal.closeTerminal();
+        });
+      });
+
+      // Regression test for: https://github.com/rancher/dashboard/issues/10016
+      it('Should not include empty prometheus selector when installing (add/remove selector).', () => {
+        ChartPage.navTo(null, 'Monitoring');
+
+        chartPage.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        const tabbedOptions = new TabbedPo();
+
+        // Get versions
+        chartPage.getVersions().then((versions) => {
+          const truncatedVersion = versions[0].substring(0, versions[0].indexOf('-rancher'));
+
+          // Check latest selected by default
+          chartPage.checkSelectedVersion(truncatedVersion);
+
+          // Set prometheus storage class
+          chartPage.goToInstall();
+          installChart.nextPage().selectTab(tabbedOptions, prometheus.tabID());
+          installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+          // Scroll into view
+          prometheus.persistentStorage().checkVisible();
+          prometheus.persistentStorage().set();
+
+          prometheus.scrollToTabBottom();
+
+          prometheus.storageClass().toggle();
+          prometheus.storageClass().clickOptionWithLabel(storageClass);
+
+          // Add a selector and then remove it - previously this would result in the empty selector being present
+          installChart.self().find(`[data-testid="input-match-expression-add-rule"]`).click();
+          installChart.self().find(`[data-testid="input-match-expression-remove-control-0"]`).click();
+
+          // Click on YAML. In YAML mode, the prometheus selector is present but empty
+          // It should not be sent to the API
+          installChart.editYaml();
+
+          installChart.installChart();
+
+          cy.wait('@prometheusChartCreation', { requestTimeout: 10000 }).then((req) => {
+            const monitoringChart = req.request?.body.charts.find((chart: any) => chart.chartName === 'rancher-monitoring');
+
+            expect(monitoringChart.values.prometheus).to.deep.equal(prometheusSpec.values.prometheus);
+          });
+
+          chartInstalledAppsListPage.waitForPage(null, null, MEDIUM_TIMEOUT_OPT);
+          terminal.closeTerminal();
+        });
+      });
+    });
+
+    describe('Grafana resource configuration', () => {
+      beforeEach(() => {
+        ChartPage.navTo(null, 'Monitoring');
+        chartPage.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        cy.intercept('POST', 'v1/catalog.cattle.io.clusterrepos/rancher-charts?*', {
+          statusCode: 201,
+          body:       {
+            type:               'chartActionOutput',
+            links:              {},
+            operationName:      'helm-operation-test',
+            operationNamespace: 'fleet-local'
+          }
+        }).as('prometheusChartCreation');
+
+        cy.intercept('GET', 'v1/catalog.cattle.io.operations/fleet-local/helm-operation-test?*', {
+          statusCode: 200,
+          body:       {
+            id:   'fleet-local/helm-operation-test',
+            kind: 'Operation',
+          }
+        });
+      });
+
+      it('Should allow for Grafana resource requests/limits configuration', () => {
+        const tabbedOptions = new TabbedPo();
+        const grafana = new GrafanaTab();
+
+        // Set Grafana resource request/limits configuration
+        chartPage.goToInstall();
+        installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        installChart.nextPage().selectTab(tabbedOptions, grafana.tabID());
+        installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
+
+        grafana.requestedCpu().checkExists();
+        grafana.requestedCpu().checkVisible();
+        grafana.requestedCpu().set('123m');
+
+        grafana.requestedMemory().checkExists();
+        grafana.requestedMemory().checkVisible();
+        grafana.requestedMemory().set('567Mi');
+
+        grafana.cpuLimit().checkExists();
+        grafana.cpuLimit().checkVisible();
+        grafana.cpuLimit().set('87m');
+
+        grafana.memoryLimit().checkExists();
+        grafana.memoryLimit().checkVisible();
+        grafana.memoryLimit().set('123Mi');
+
+        // Check default Grafana storage value for pvc and statefulset types
+        // pvc
+        grafana.storageOptions().set(2);
+        grafana.storagePvcSizeInput().checkExists();
+        grafana.storagePvcSizeInput().checkVisible();
+        grafana.storagePvcSizeInput().self().invoke('val').should('equal', DEFAULT_GRAFANA_STORAGE_SIZE);
+        // statefulset
+        grafana.storageOptions().set(3);
+        grafana.storageStatefulsetSizeInput().checkExists();
+        grafana.storageStatefulsetSizeInput().checkVisible();
+        grafana.storageStatefulsetSizeInput().self().invoke('val').should('equal', DEFAULT_GRAFANA_STORAGE_SIZE);
+        // back to disabled
+        grafana.storageOptions().set(0);
+
+        // Click on YAML. In YAML mode, the prometheus selector is present but empty
+        // It should not be sent to the API
+        installChart.editYaml();
+
+        installChart.installChart();
+
+        cy.wait('@prometheusChartCreation', { requestTimeout: 10000 }).then((req) => {
+          const monitoringChart = req.request?.body.charts.find((chart: any) => chart.chartName === 'rancher-monitoring');
+          const resource = monitoringChart.values.grafana.resources;
+
+          expect(resource.requests.cpu).to.equal('123m');
+          expect(resource.requests.memory).to.equal('567Mi');
+          expect(resource.limits.cpu).to.equal('87m');
+          expect(resource.limits.memory).to.equal('123Mi');
+        });
+      });
+    });
+  });
 });
-
-// describe.skip('[Vue3 Skip]: Charts', { tags: ['@charts', '@adminUser'] }, () => {
-//   const chartsPage = new ChartsPage();
-//   const chartPage = new ChartPage();
-//   const installChart = new InstallChartPage();
-//   const terminal = new Kubectl();
-//   const prometheus = new PrometheusTab();
-//   const alerting = new AlertingTab();
-//   const istio = new IstioTab();
-
-//   before(() => {
-//     cy.login();
-//     cy.viewport(1280, 720);
-//   });
-
-//   after(() => {
-//     uninstallApp('cattle-monitoring-system', 'rancher-monitoring-crd');
-//     uninstallApp('cattle-monitoring-system', 'rancher-monitoring');
-//     uninstallApp('istio-system', 'rancher-istio');
-//   });
-
-//   function uninstallApp(namespace: string, name: string) {
-//     cy.createRancherResource('v1', `catalog.cattle.io.apps/${ namespace }/${ name }?action=uninstall`, '{}');
-//     // Need to wait between uninstalls (not ideal)
-//     cy.wait(2000); // eslint-disable-line cypress/no-unnecessary-waiting
-//   }
-
-//   describe('Monitoring', { testIsolation: 'off' }, () => {
-//     describe('Prometheus local provisioner config', () => {
-//       const provisionerVersion = 'v0.0.24';
-
-//       // Install the chart
-//       before(() => {
-//         ChartsPage.navTo();
-//         chartsPage.waitForPage();
-
-//         // Open terminal
-//         terminal.openTerminal(LONG_TIMEOUT_OPT);
-
-//         // kubectl commands
-//         terminal.executeCommand(`apply -f https://raw.githubusercontent.com/rancher/local-path-provisioner/${ provisionerVersion }/deploy/local-path-storage.yaml`)
-//           .executeCommand('create -f https://raw.githubusercontent.com/rancher/local-path-provisioner/master/examples/pvc/pvc.yaml')
-//           .executeCommand('create -f https://raw.githubusercontent.com/rancher/local-path-provisioner/master/examples/pod/pod.yaml');
-
-//         terminal.closeTerminal();
-//       });
-
-//       beforeEach(() => {
-//         cy.intercept('POST', 'v1/catalog.cattle.io.clusterrepos/rancher-charts?action=install').as('prometheusChartCreation');
-//       });
-
-//       it('Should not include empty prometheus selector when installing.', () => {
-//         ChartPage.navTo(null, 'Monitoring');
-
-//         chartPage.waitForChartPage('rancher-charts', 'rancher-monitoring');
-
-//         const tabbedOptions = new TabbedPo();
-
-//         // Latest (`104.0.0+up45.31.1`) is broken (crd installs, but not actual chart), use `103.1.1+up45.31.1` instead
-//         chartPage.selectVersion('103.1.1+up45.31...');
-
-//         // Navigate to the edit options page and Set prometheus storage class
-//         chartPage.goToInstall();
-//         installChart.nextPage().selectTab(tabbedOptions, prometheus.tabID());
-
-//         installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
-
-//         // Scroll into view - scroll to bottom of view
-//         prometheus.scrollToTabBottom();
-
-//         prometheus.persistentStorage().checkVisible();
-//         prometheus.persistentStorage().set();
-
-//         // to check custom box element width and height in order to prevent regression
-//         // https://github.com/rancher/dashboard/issues/10000
-//         prometheus.persistentStorage().hasAppropriateWidth();
-//         prometheus.persistentStorage().hasAppropriateHeight();
-
-//         // Scroll into view - scroll to bottom of view
-//         prometheus.scrollToTabBottom();
-
-//         prometheus.storageClass().toggle();
-//         prometheus.storageClass().clickOptionWithLabel('local-path');
-
-//         // Disable installing Alert Manager
-//         installChart.nextPage().selectTab(tabbedOptions, alerting.tabID());
-
-//         installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
-
-//         alerting.deployCheckbox().checkVisible();
-//         alerting.deployCheckbox().set();
-
-//         // Click on YAML. In YAML mode, the prometheus selector is present but empty
-//         // It should not be sent to the API
-//         installChart.editYaml();
-
-//         installChart.installChart();
-
-//         cy.wait('@prometheusChartCreation', { requestTimeout: 10000 }).then((req) => {
-//           const monitoringChart = req.request?.body.charts.find((chart: any) => chart.chartName === 'rancher-monitoring');
-
-//           expect(monitoringChart.values.prometheus).to.deep.equal(prometheusSpec.values.prometheus);
-//         });
-
-//         terminal.closeTerminal();
-//       });
-
-//       // Regression test for: https://github.com/rancher/dashboard/issues/10016
-//       it('Should not include empty prometheus selector when installing (add/remove selector).', () => {
-//         ChartPage.navTo(null, 'Monitoring');
-
-//         chartPage.waitForChartPage('rancher-charts', 'rancher-monitoring');
-
-//         const tabbedOptions = new TabbedPo();
-
-//         // Latest (`104.0.0+up45.31.1`) is broken (crd installs, but not actual chart), use `103.1.1+up45.31.1` instead
-//         chartPage.selectVersion('103.1.1+up45.31...');
-
-//         // Set prometheus storage class
-//         chartPage.goToInstall();
-//         installChart.nextPage().editOptions(tabbedOptions, '[data-testid="btn-prometheus"]');
-//         installChart.waitForChartPage('rancher-charts', 'rancher-monitoring');
-
-//         // Scroll into view - scroll to bottom of view
-//         prometheus.scrollToTabBottom();
-
-//         prometheus.persistentStorage().checkVisible();
-//         prometheus.persistentStorage().set();
-
-//         prometheus.scrollToTabBottom();
-
-//         prometheus.storageClass().toggle();
-//         prometheus.storageClass().clickOptionWithLabel('local-path');
-
-//         // Add a selector and then remove it - previously this would result in the empty selector being present
-//         installChart.self().find(`[data-testid="input-match-expression-add-rule"]`).click();
-//         installChart.self().find(`[data-testid="input-match-expression-remove-control-0"]`).click();
-
-//         // Click on YAML. In YAML mode, the prometheus selector is present but empty
-//         // It should not be sent to the API
-//         installChart.editYaml();
-
-//         installChart.installChart();
-
-//         cy.wait('@prometheusChartCreation', { requestTimeout: 10000 }).then((req) => {
-//           const monitoringChart = req.request?.body.charts.find((chart: any) => chart.chartName === 'rancher-monitoring');
-
-//           expect(monitoringChart.values.prometheus).to.deep.equal(prometheusSpec.values.prometheus);
-//         });
-
-//         terminal.closeTerminal();
-//       });
-//     });
-
-//     describe('Grafana resource configuration', () => {
-//       beforeEach(() => {
-//         ChartPage.navTo(null, 'Monitoring');
-//         cy.intercept('POST', 'v1/catalog.cattle.io.clusterrepos/rancher-charts?*', {
-//           statusCode: 201,
-//           body:       {
-//             type:               'chartActionOutput',
-//             links:              {},
-//             operationName:      'helm-operation-test',
-//             operationNamespace: 'fleet-local'
-//           }
-//         }).as('prometheusChartCreation');
-
-//         cy.intercept('GET', 'v1/catalog.cattle.io.operations/fleet-local/helm-operation-test?*', {
-//           statusCode: 200,
-//           body:       {
-//             id:   'fleet-local/helm-operation-test',
-//             kind: 'Operation',
-//           }
-//         });
-//       });
-
-//       it('Should allow for Grafana resource requests/limits configuration', () => {
-//         const tabbedOptions = new TabbedPo();
-//         const grafana = new GrafanaTab();
-
-//         // Set Grafana resource request/limits configuration
-//         chartPage.goToInstall();
-//         installChart.nextPage().editOptions(tabbedOptions, '[data-testid="btn-grafana"');
-
-//         grafana.requestedCpu().checkExists();
-//         grafana.requestedCpu().checkVisible();
-//         grafana.requestedCpu().set('123m');
-
-//         grafana.requestedMemory().checkExists();
-//         grafana.requestedMemory().checkVisible();
-//         grafana.requestedMemory().set('567Mi');
-
-//         grafana.cpuLimit().checkExists();
-//         grafana.cpuLimit().checkVisible();
-//         grafana.cpuLimit().set('87m');
-
-//         grafana.memoryLimit().checkExists();
-//         grafana.memoryLimit().checkVisible();
-//         grafana.memoryLimit().set('123Mi');
-
-//         // Check default Grafana storage value for pvc and statefulset types
-//         // pvc
-//         grafana.storageOptions().set(2);
-//         grafana.storagePvcSizeInput().checkExists();
-//         grafana.storagePvcSizeInput().checkVisible();
-//         grafana.storagePvcSizeInput().self().invoke('val').should('equal', DEFAULT_GRAFANA_STORAGE_SIZE);
-//         // statefulset
-//         grafana.storageOptions().set(3);
-//         grafana.storageStatefulsetSizeInput().checkExists();
-//         grafana.storageStatefulsetSizeInput().checkVisible();
-//         grafana.storageStatefulsetSizeInput().self().invoke('val').should('equal', DEFAULT_GRAFANA_STORAGE_SIZE);
-//         // back to disabled
-//         grafana.storageOptions().set(0);
-
-//         // Click on YAML. In YAML mode, the prometheus selector is present but empty
-//         // It should not be sent to the API
-//         installChart.editYaml();
-
-//         installChart.installChart();
-
-//         cy.wait('@prometheusChartCreation', { requestTimeout: 10000 }).then((req) => {
-//           const monitoringChart = req.request?.body.charts.find((chart: any) => chart.chartName === 'rancher-monitoring');
-//           const resource = monitoringChart.values.grafana.resources;
-
-//           expect(resource.requests.cpu).to.equal('123m');
-//           expect(resource.requests.memory).to.equal('567Mi');
-//           expect(resource.limits.cpu).to.equal('87m');
-//           expect(resource.limits.memory).to.equal('123Mi');
-//         });
-//       });
-//     });
-//   });
-
-//   /**
-//    * Istio requires Prometheus operator to be installed, see previous steps.
-//    */
-//   describe('Istio', () => {
-//     beforeEach(() => {
-//       cy.login();
-//       HomePagePo.goTo();
-//     });
-
-//     describe('Istio local provisioning', () => {
-//       it('Should install Istio', () => {
-//         ChartPage.navTo(null, 'Istio');
-
-//         chartPage.waitForChartPage('rancher-charts', 'rancher-istio');
-
-//         chartPage.goToInstall();
-//         installChart.nextPage();
-//         installChart.waitForChartPage('rancher-charts', 'rancher-istio');
-
-//         // Disable Ingress Gateway
-//         istio.enableIngressGatewayCheckbox().checkExists();
-//         istio.enableIngressGatewayCheckbox().set();
-
-//         cy.intercept('POST', 'v1/catalog.cattle.io.clusterrepos/rancher-charts?action=install').as('chartInstall');
-//         installChart.installChart();
-//         cy.wait('@chartInstall', LONG_TIMEOUT_OPT).its('response.statusCode').should('eq', 201);
-
-//         terminal.waitForTerminalToBeVisible();
-//         terminal.closeTerminal();
-//       });
-
-//       it('Side-nav should contain Istio menu item', () => {
-//         ClusterDashboardPagePo.navTo();
-
-//         const productMenu = new ProductNavPo();
-
-//         productMenu.navToSideMenuGroupByLabel('Istio');
-
-//         cy.contains('Overview').should('exist');
-//         cy.contains('Powered by Istio').should('exist');
-//       });
-//     });
-//   });
-// });

shell/chart/monitoring/grafana/index.vue

@@ -265,7 +265,10 @@ export default {
             />
           </div>
           <div class="col span-6">
-            <div v-if="showStorageClasses">
+            <div
+              v-if="showStorageClasses"
+              data-testid="select-chart-grafana-storage-class"
+            >
               <StorageClassSelector
                 :value="value.grafana.persistence.storageClassName"
                 :mode="mode"
@@ -332,7 +335,10 @@ export default {
             />
           </div>
           <div class="col span-6">
-            <div v-if="showStorageClasses">
+            <div
+              v-if="showStorageClasses"
+              data-testid="select-chart-grafana-storage-class"
+            >
               <StorageClassSelector
                 :value="value.grafana.persistence.storageClassName"
                 :mode="mode"