Upgrade cypress version (#1353)

* upgrading cypress version * Fixing cypress test * Fixing cypress glob pattern * updating cypress config * Fixing file input test cases * Fixing cypress test * Fixing test * Fixing test cases * Fixing test cases * Renaming spec.js to cy.js file * Fixing test * Fixing flkay test * fixing test
adobe · Sep 16, 2024 · a8f06f0 · a8f06f0
1 parent e1a2739
commit a8f06f0
Show file tree

Hide file tree

Showing 136 changed files with 3,163 additions and 2,798 deletions.
diff --git a/.circleci/ci/it-tests.js b/.circleci/ci/it-tests.js
@@ -146,7 +146,7 @@ try {
         let testSuites = params.join(',');
         if (CORE_COMPONENTS) {
             // we run only some test suites for older core components
-            testSuites = "specs/prefill/customprefill.spec.js,specs/prefill/repeatableprefillwithzerooccurrencefortabaccordionwizard.spec.js,specs/actions/submit/submit.runtime.spec.js,specs/actions/render/render_with_openapi.spec.js";
+            testSuites = "specs/prefill/customprefill.cy.js,specs/prefill/repeatableprefillwithzerooccurrencefortabaccordionwizard.cy.js,specs/actions/submit/submit.runtime.cy.js,specs/actions/render/render_with_openapi.cy.js";
         }
         // start running the tests
         ci.dir('ui.tests', () => {

diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -67,7 +67,7 @@ common:
           # Supports 'Re-run failed tests only'. See this for more info: https://circleci.com/docs/rerun-failed-tests-only/
           command: |
             cd ui.tests/test-module
-            TESTFILES=$(circleci tests glob "specs/**/*.spec.js")
+            TESTFILES=$(circleci tests glob "specs/**/*.cy.js")
             cd ../../
             echo "false" >> TEST_EXECUTION_STATUS.txt
             echo $TESTFILES | circleci tests run --command="xargs node .circleci/ci/it-tests.js" --verbose --split-by=timings
@@ -107,6 +107,13 @@ common:
       # Save test results as artifacts
       - store_artifacts:
           path: ui.tests/test-module/target
+      - run:
+          name: Move .cy.json files to target directory of cypress
+          command: |
+            mkdir -p ui.tests/test-module/target/cy-json
+            find ui.tests/test-module -name "*.cy.json" -exec mv {} ui.tests/test-module/target/cy-json/ \;
+      - store_artifacts:
+          path: ui.tests/test-module/target/cy-json
       # Save AEM logs as artifacts
       - store_artifacts:
           path: logs

diff --git a/.gitignore b/.gitignore
@@ -67,3 +67,6 @@ ui.tests/test-module/reports
 ui.tests/test-module/cypress
 
 .java-version
+
+# Ignore Cypress runtime JSON files
+ui.tests/test-module/**/*.cy.json
diff --git a/...ps/src/main/content/jcr_root/apps/core/fd/components/af-commons/v1/datalayer/datalayer.js b/...ps/src/main/content/jcr_root/apps/core/fd/components/af-commons/v1/datalayer/datalayer.js
@@ -98,7 +98,7 @@
 
             function onElementFocusChanged(event){
                 let fieldData = getCurrentFieldData(event.detail.fieldId, dataLayerContent);
-                if(fieldData[FIELD_TYPE] === 'button'){
+                if(fieldData && fieldData[FIELD_TYPE] === 'button'){
                     return;
                 }
                 dataLayer.push({

diff --git a/ui.tests/pom.xml b/ui.tests/pom.xml
@@ -35,7 +35,7 @@
 
     <properties>
         <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
-        <node.version>v10.0.0</node.version>
+        <node.version>v16.13.1</node.version>
         <npm.version>7.5.4</npm.version>
 
         <HEADLESS_BROWSER>false</HEADLESS_BROWSER>
@@ -123,6 +123,9 @@
                                 <goals>
                                     <goal>npm</goal>
                                 </goals>
+                                <configuration>
+                                    <arguments>install --legacy-peer-deps</arguments>
+                                </configuration>
                             </execution>
                         </executions>
                     </plugin>
@@ -160,6 +163,9 @@
                                 <goals>
                                     <goal>npm</goal>
                                 </goals>
+                                <configuration>
+                                    <arguments>install --legacy-peer-deps</arguments>
+                                </configuration>
                             </execution>
                         </executions>
                     </plugin>
@@ -235,6 +241,7 @@
                                 </goals>
                                 <configuration>
                                     <skip>${skipTests}</skip>
+                                    <arguments>install --legacy-peer-deps</arguments>
                                 </configuration>
                             </execution>
                         </executions>
@@ -300,6 +307,9 @@
                                 <goals>
                                     <goal>npm</goal>
                                 </goals>
+                                <configuration>
+                                    <arguments>install --legacy-peer-deps</arguments>
+                                </configuration>
                             </execution>
                         </executions>
                     </plugin>
@@ -358,7 +368,7 @@
                                         <argument>--reporter</argument>
                                         <argument>cypress-multi-reporters</argument>
                                         <argument>--reporter-options</argument>
-                                        <argument>configFile=cypress.json</argument>
+                                        <argument>configFile=cypress.config.js</argument>
                                         <argument>--env</argument>
                                         <!-- value of forms.far is addon or addon-latest -->
                                         <argument>CYPRESS_baseUrl=${AEM_AUTHOR_URL},crx.username=${AEM_AUTHOR_USERNAME},crx.password=${AEM_AUTHOR_PASSWORD},forms.far=${FORMS_FAR},core.components.version=${CORE_COMPONENTS}</argument>

diff --git a/ui.tests/test-module/README.md b/ui.tests/test-module/README.md
@@ -5,7 +5,7 @@ Sample UI tests using [Cypress](https://www.cypress.io//) framework
 
 
 * `package.json` Project definition: dependencies, npm scripts, ...
-* `cypress.json` Cypress configuration: reporters, browser capabilities, ...
+* `cypress.config.js` Cypress configuration: reporters, browser capabilities, ...
 * `specs` Tests
 
 

diff --git a/ui.tests/test-module/cypress.config.js b/ui.tests/test-module/cypress.config.js
@@ -0,0 +1,42 @@
+const { defineConfig } = require('cypress');
+
+module.exports = defineConfig({
+  fixturesFolder: 'libs/fixtures',
+  screenshotsFolder: 'target/screenshots',
+  videosFolder: 'target/videos',
+  videoUploadOnPasses: false,
+  video: true,
+  chromeWebSecurity: true,
+  viewportHeight: 900,
+  viewportWidth: 1440,
+  pageLoadTimeout: 200000,
+  defaultCommandTimeout: 10000,
+  responseTimeout: 120000,
+  watchForFileChanges: true,
+  trashAssetsBeforeRuns: true,
+  reporterEnabled: 'spec, cypress-circleci-reporter',
+  retries: {
+    runMode: 2,
+    openMode: 0,
+  },
+  e2e: {
+    setupNodeEvents(on, config) {
+      on('before:browser:launch', (browser = {}, launchOptions) => {
+        if (browser.family === 'chromium' && browser.name !== 'electron') {
+          launchOptions.args.push('--start-fullscreen')
+
+          return launchOptions
+        }
+        if (browser.name === 'electron') {
+          launchOptions.preferences.fullscreen = true
+          return launchOptions
+        }
+      })
+      config.env.specPattern = 'specs/**/*.cy.{js,jsx,ts,tsx}';
+      return require('./libs/plugins/index.js')(on, config);
+    },
+    baseUrl: 'http://localhost:4502',
+    specPattern: 'specs/**/*.cy.{js,jsx,ts,tsx}',
+    supportFile: 'libs/support/index.js',
+  },
+});
diff --git a/ui.tests/test-module/cypress.json b/ui.tests/test-module/cypress.json
diff --git a/ui.tests/test-module/libs/fixtures/panelcontainer/bankSubmissionAll.json b/ui.tests/test-module/libs/fixtures/panelcontainer/bankSubmissionAll.json
@@ -13,7 +13,7 @@
     },
     "employment": {},
     "offer": {},
-    "attachments": [null],
+    "attachments": [{}],
     "homeAddress": {},
     "officeAddress": {},
     "witness": [{

diff --git a/ui.tests/test-module/libs/fixtures/panelcontainer/bankSubmissionInnerInstanceRemoved.json b/ui.tests/test-module/libs/fixtures/panelcontainer/bankSubmissionInnerInstanceRemoved.json
@@ -13,7 +13,7 @@
     },
     "employment": {},
     "offer": {},
-    "attachments": [null],
+    "attachments": [{}],
     "homeAddress": {},
     "officeAddress": {},
     "witness": [{

diff --git a/ui.tests/test-module/libs/fixtures/panelcontainer/bankSubmissionOuterInstanceRemoved.json b/ui.tests/test-module/libs/fixtures/panelcontainer/bankSubmissionOuterInstanceRemoved.json
@@ -13,7 +13,7 @@
     },
     "employment": {},
     "offer": {},
-    "attachments": [null],
+    "attachments": [{}],
     "homeAddress": {},
     "officeAddress": {},
     "witness": [{

diff --git a/ui.tests/test-module/libs/plugins/index.js b/ui.tests/test-module/libs/plugins/index.js
@@ -34,17 +34,33 @@ const path = require('path');
  * @type {Cypress.PluginConfig}
  */
 module.exports = (on, config) => {
-  // `on` is used to hook into various events Cypress emits
-  // `config` is the resolved Cypress config
+    // `on` is used to hook into various events Cypress emits
+    // `config` is the resolved Cypress config
+
+    // Debugging: Log the values of config.fileServerFolder and config.env.specPattern
+    console.log('config.fileServerFolder:', config.fileServerFolder);
+    console.log('config.env.specPattern:', config.env.specPattern);
+
+    const specPattern = config.env.specPattern;
+    if (typeof specPattern !== 'string') {
+        throw new TypeError('The "to" argument must be of type string. Received ' + typeof specPattern);
+    }
+
+    const fileServerFolder = config.fileServerFolder;
+    if (typeof fileServerFolder !== 'string') {
+        throw new TypeError('The "to" argument must be of type string. Received ' + typeof fileServerFolder);
+    }
+
     const options = {
         outputRoot: config.projectRoot + '/target/',
         // Used to trim the base path of specs and reduce nesting in the
         // generated output directory.
-        specRoot: path.relative(config.fileServerFolder, config.integrationFolder),
+        specRoot: path.relative(fileServerFolder, specPattern),
         outputTarget: {
             'cypress-logs|json': 'json'
         }
     };
+
     require('cypress-terminal-report/src/installLogsPrinter')(on, options);
-    require('cypress-log-to-output').install(on)
-};
+    require('cypress-log-to-output').install(on);
+};
diff --git a/ui.tests/test-module/libs/support/commands.js b/ui.tests/test-module/libs/support/commands.js
@@ -40,7 +40,7 @@
 // -- This will overwrite an existing command --
 // Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... })
 
-import 'cypress-file-upload';
+
 import { recurse } from 'cypress-recurse';
 
 const commons = require('../commons/commons'),
@@ -702,7 +702,8 @@ Cypress.Commands.add("attachConsoleErrorSpy", () => {
  */
 Cypress.Commands.add("expectNoConsoleErrors", () => {
     return cy.window().then(win => {
-        expect(win.console.error).to.have.callCount(0);
+        const spy = cy.spy(win.console, 'error');
+        cy.wrap(spy).should('have.callCount', 0);
     });
 });
 
@@ -759,3 +760,31 @@ Cypress.Commands.add("changeLanguage", (str) => {
     cy.get(`coral-selectlist-item[value=${str}]`).click({force: true});
     cy.get(siteSelectors.locale.accept).click();
 });
+
+
+const mimeTypes = {
+    'pdf': 'application/pdf',
+    'txt': 'text/plain',
+    'bat': 'application/x-msdos-program',
+    'msg': 'application/vnd.ms-outlook',
+    // Add more mappings as needed
+};
+
+const getMimeType = (fileName) => {
+    const extension = fileName.split('.').pop();
+    return mimeTypes[extension] || 'application/octet-stream';
+};
+
+Cypress.Commands.add("attachFile", (fileInput, fileNames) => {
+    const uploads = fileNames.map(fileName => {
+        const mimeType = getMimeType(fileName);
+        return cy.fixture(fileName, { encoding: null }).then(fileContent => {
+            return cy.get(fileInput).selectFile({
+                contents: fileContent,
+                fileName: fileName,
+                mimeType: mimeType
+            }, { force: true });
+        });
+    });
+    return cy.wrap(uploads);
+});