chore(deps): update dependency cypress to ^14.0.1 (#11625)

* chore(deps): update dependency cypress to ^14.0.1

* added cypress config file

* updated aboutmodal.spec.ts file

* added before() hook

* added before() to few test suites

* testing beforeEach() hook

* set test isolation to false

* added support file

* fixed errors

Author: Mash707

packages/react-integration/cypress.config.ts

@@ -0,0 +1,19 @@
+import { defineConfig } from 'cypress';
+
+export default defineConfig({
+  e2e: {
+    specPattern: 'cypress/integration/**/*.spec.ts',
+    video: false,
+    screenshotOnRunFailure: false,
+    viewportWidth: 1200,
+    viewportHeight: 792,
+    supportFile: 'cypress/support/index.js',
+    testIsolation: false
+  },
+  reporter: 'junit',
+  reporterOptions: {
+    mochaFile: 'results/my-test-output-[hash].xml',
+    toConsole: true
+  },
+  waitForAnimations: false
+});

packages/react-integration/cypress.json

@@ -44,28 +44,16 @@ describe('Drawer Demo Test', () => {
     $drawerPanel.should('have.class', 'pf-m-width-50-on-lg');
     $drawerPanel.should('have.class', 'pf-m-width-33-on-xl');
     $drawerPanel.should('have.class', 'pf-m-width-25-on-2xl');
-    $drawerPanel.should('have.css', 'flex-basis', 'max(0% + 24px, min(0% + 300px, 100% + 0px))');
+    $drawerPanel.should('have.css', 'flex-basis', 'max(24px, min(300px, 100%))');
     // Medium viewport
     cy.viewport(800, 660);
-    cy.get('#basic-drawer .pf-v6-c-drawer__panel').should(
-      'have.css',
-      'flex-basis',
-      'max(0% + 24px, min(100% + 0px, 100% + 0px))'
-    );
+    cy.get('#basic-drawer .pf-v6-c-drawer__panel').should('have.css', 'flex-basis', 'max(24px, min(100%, 100%))');
     // Xl viewport
     cy.viewport(1200, 660);
-    cy.get('#basic-drawer .pf-v6-c-drawer__panel').should(
-      'have.css',
-      'flex-basis',
-      'max(0% + 24px, min(0% + 300px, 100% + 0px))'
-    );
+    cy.get('#basic-drawer .pf-v6-c-drawer__panel').should('have.css', 'flex-basis', 'max(24px, min(300px, 100%))');
     // 2Xl viewport
     cy.viewport(1450, 660);
-    cy.get('#basic-drawer .pf-v6-c-drawer__panel').should(
-      'have.css',
-      'flex-basis',
-      'max(0% + 24px, min(0% + 300px, 100% + 0px))'
-    );
+    cy.get('#basic-drawer .pf-v6-c-drawer__panel').should('have.css', 'flex-basis', 'max(24px, min(300px, 100%))');
   });
 
   it('Verify that focus gets sent to drawer', () => {

packages/react-integration/cypress/integration/drawer.spec.ts

@@ -4,7 +4,7 @@ describe('Drawer Resize Demo Test', () => {
   });
 
   it('Verify resizable drawer', () => {
-    cy.get('.pf-v6-c-drawer__panel').should('have.css', 'flex-basis', 'max(0% + 24px, min(0% + 200px, 100% + 0px))');
+    cy.get('.pf-v6-c-drawer__panel').should('have.css', 'flex-basis', 'max(24px, min(200px, 100%))');
     cy.get('.pf-v6-c-drawer__panel').should('have.class', 'pf-m-resizable');
     cy.get('.pf-v6-c-drawer').should('not.have.class', 'pf-m-expanded');
     cy.get('#toggleButton').click();

packages/react-integration/cypress/integration/drawerresize.spec.ts

@@ -89,7 +89,7 @@ describe('Form Demo Test', () => {
 
   it('Verify pressing spacebar selects the checkbox component', () => {
     const $checkbox = cy.get('#subscribe');
-    $checkbox.should('not.be.checked');
+    $checkbox.should('not.be.checked').focus();
     $checkbox.type(' ');
     $checkbox.should('be.checked');
     $checkbox.type(' '); // should be unchecked but isn't

packages/react-integration/cypress/integration/form.spec.ts

@@ -28,7 +28,7 @@
     "test:integration": "cypress run"
   },
   "devDependencies": {
-    "cypress": "^8.7.0",
+    "cypress": "^14.0.1",
     "cypress-plugin-tab": "^1.0.5",
     "junit-merge": "^2.0.0"
   }