mgr/dashboard: upgrade to cypress 12

Looks like chrome 117 will need cypress >=12.15.0
cypress-io/cypress-documentation#5479

Signed-off-by: Nizamudeen A <nia@redhat.com>

src/pybind/mgr/dashboard/frontend/cypress.config.ts

@@ -1,4 +1,4 @@
-import { defineConfig } from 'cypress'
+import { defineConfig } from 'cypress';
 
 export default defineConfig({
   video: true,
@@ -9,34 +9,47 @@ export default defineConfig({
   viewportWidth: 1920,
   projectId: 'k7ab29',
   reporter: 'cypress-multi-reporters',
+
   reporterOptions: {
     reporterEnabled: 'spec, mocha-junit-reporter',
     mochaJunitReporterReporterOptions: {
-      mochaFile: 'cypress/reports/results-[hash].xml',
-    },
+      mochaFile: 'cypress/reports/results-[hash].xml'
+    }
   },
+
   retries: 1,
+
   env: {
     LOGIN_USER: 'admin',
     LOGIN_PWD: 'admin',
-    CEPH2_URL: 'https://localhost:4202/',
+    CEPH2_URL: 'https://localhost:4202/'
   },
+
   chromeWebSecurity: false,
   eyesIsDisabled: false,
   eyesFailCypressOnDiff: true,
   eyesDisableBrowserFetching: false,
   eyesLegacyHooks: true,
   eyesTestConcurrency: 5,
   eyesPort: 35321,
+
   e2e: {
     // We've imported your old cypress plugins here.
     // You may want to clean this up later by importing these.
     setupNodeEvents(on, config) {
-      return require('./cypress/plugins/index.js')(on, config)
+      return require('./cypress/plugins/index.js')(on, config);
     },
     baseUrl: 'https://localhost:4200/',
     excludeSpecPattern: ['*.po.ts', '**/orchestrator/**'],
     experimentalSessionAndOrigin: true,
-    specPattern: 'cypress/e2e/**/*-spec.{js,jsx,ts,tsx,feature}',
+    specPattern: 'cypress/e2e/**/*-spec.{js,jsx,ts,tsx,feature}'
   },
-})
+
+  component: {
+    devServer: {
+      framework: 'angular',
+      bundler: 'webpack'
+    },
+    specPattern: '**/*.cy.ts'
+  }
+});

src/pybind/mgr/dashboard/frontend/cypress/support/commands.ts

@@ -86,8 +86,14 @@ function requestAuth(username: string, password: string, url = '') {
 }
 
 // @ts-ignore
-Cypress.Commands.add('text', { prevSubject: true }, (subject: any) => {
-  return subject.text();
+Cypress.Commands.add('text', { prevSubject: true }, ($element: JQuery<HTMLElement>) => {
+  cy.wrap($element).scrollIntoView();
+  return cy
+    .wrap($element)
+    .invoke('text')
+    .then((text: string) => {
+      return text.toString();
+    });
 });
 
 Cypress.Commands.add('logToConsole', (message: string, optional?: any) => {