New: Cypress task log added, cypress commands file added, cypress get… (

#3489)

* New: Cypress task log added, cypress commands file added, cypress getData command added.

* let updated to const.

Co-authored-by: Cahir O'Doherty <[email protected]>

* explicit import removed, import still required.

* Updated to make the data loading .json file and language agnostic

* Revert changes to config.json

* Revert unawait grunt server

* Specify coursedir as variable

* Allow multilanguage, alternate coursedir and build config in tests

* Updated comments

* Removed bad argument

---------

Co-authored-by: Cahir O'Doherty <[email protected]>
Co-authored-by: Oliver Foster <[email protected]>

.eslintrc.json

@@ -4,7 +4,8 @@
         "commonjs": false,
         "es2022": true,
         "amd": true,
-        "jest": true
+        "jest": true,
+        "cypress": true
     },
     "extends": [
         "standard",

cypress.config.js

@@ -5,7 +5,15 @@ module.exports = defineConfig({
     baseUrl: 'http://localhost:9001/',
     screenshotOnRunFailure: false,
     video: false,
-    supportFile: false,
-    specPattern: '**/test/e2e/**/*.cy.{js,jsx}'
+    supportFile: '**/test/e2e/commands.js',
+    specPattern: '**/test/e2e/**/*.cy.{js,jsx}',
+    setupNodeEvents (on, config) {
+      on('task', {
+        log(message) {
+          console.log(message);
+          return null;
+        }
+      });
+    }
   }
 });

grunt/helpers/Data.js

@@ -70,7 +70,7 @@ class Data {
       });
       language.load();
       return language;
-    });
+    }).filter(lang => lang.isValid);
     this.configFile = new JSONFile({
       framework: this.framework,
       path: path.join(coursePath, `config.${this.jsonext}`)

grunt/helpers/data/Language.js

@@ -107,18 +107,21 @@ class Language {
       return index;
     }, {});
 
-    this.getCourseFileItem();
-
     return this;
   }
 
+  /** @type {boolean} */
+  get isValid() {
+    return Boolean(this.courseFileItem);
+  }
+
   /** @type {boolean} */
   get hasChanged() {
     return this.files.some(file => file.hasChanged);
   }
 
   /**
-   * Produces a manifest file for the Framework data layer at course/language_data_manifest.js.
+   * Produces a manifest file for the Framework data layer at course/lang/language_data_manifest.js.
    * @returns {Language}
    */
   saveManifest() {

test.js

@@ -82,10 +82,10 @@ async function waitForGruntServer() {
 
 async function cypressRun() {
   if (argumentValues.testfiles) {
-    return asyncSpawn('node', './node_modules/cypress/bin/cypress', 'run', '--spec', `${argumentValues.testfiles}`);
+    return asyncSpawn('node', './node_modules/cypress/bin/cypress', 'run', '--spec', `${argumentValues.testfiles}`, '--config', `{"fixturesFolder": "${argumentValues.outputdir}"}`);
   }
 
-  return asyncSpawn('node', './node_modules/cypress/bin/cypress', 'run');
+  return asyncSpawn('node', './node_modules/cypress/bin/cypress', 'run', '--config', `{"fixturesFolder": "${argumentValues.outputdir}"}`);
 };
 
 async function jestRun() {

test/e2e/commands.js

@@ -0,0 +1,109 @@
+function getBuild() {
+  try {
+    return cy.fixture(`adapt/js/build.min.js`).then(build => {
+      // Return for cy.getBuild().then(build => {});
+      // Expose this.build in cypress
+      return cy.wrap(build).as('build');
+    });
+  } catch {
+    cy.task('log', 'fail');
+  }
+}
+
+function getConfig() {
+  return getBuild().then(build => {
+    // Load the config.json
+    return cy.fixture(`${build.coursedir}/config.json`).then(config => {
+      // Return for cy.getConfig().then(config => {});
+      // Expose this.config in cypress
+      return cy.wrap(config).as('config');
+    });
+  });
+}
+
+function getData(languageCode = null) {
+  try {
+    // Setup data array
+    const data = [];
+    // Expose this.data in cypress
+    cy.wrap(data).as('data');
+    // Allow adapt-style shorthand properties:
+    // this.data.course, this.data.contentObjects, this.data.articles, etc
+    Object.defineProperties(data, {
+      course: {
+        get() {
+          return data.find(item => item._type === 'course');
+        },
+        enumerable: false
+      },
+      contentObjects: {
+        get() {
+          return data.filter(item => ['menu','page'].includes(item._type));
+        },
+        enumerable: false
+      },
+      articles: {
+        get() {
+          return data.filter(item => item._type === 'article');
+        },
+        enumerable: false
+      },
+      blocks: {
+        get() {
+          return data.filter(item => item._type === 'block');
+        },
+        enumerable: false
+      },
+      components: {
+        get() {
+          return data.filter(item => item._type === 'component');
+        },
+        enumerable: false
+      }
+    });
+    return getBuild().then(build => {
+      const {
+        coursedir,
+        availableLanguageNames
+      } = build;
+      // Load the config.json
+      return getConfig().then(config => {
+        // Check that the specified language is available
+        const defaultLanguage = config._defaultLanguage;
+        languageCode = languageCode ?? defaultLanguage;
+        if (!availableLanguageNames.includes(languageCode)) {
+          throw new Error(`Language code is not available: ${languageCode}`);
+        }
+        // Load the language_data_manifest.js for the default or specified language
+        cy.fixture(`${coursedir}/${languageCode}/language_data_manifest.js`).then(languageDataManifest => {
+          // Load each of the files specified in the manifest
+          languageDataManifest.forEach(localFilePath => {
+            const filePath = `${coursedir}/${languageCode}/${localFilePath}`
+            cy.fixture(filePath).then(fileData => {
+              // Add __index__ and __path__ attributes to each object as in adapt
+              // so that each object's origin can be identified later if necessary
+              if (Array.isArray(fileData)) {
+                fileData.forEach((item, index) => {
+                  item.__index__ = index;
+                  item.__path__ = filePath;
+                });
+                data.push(...fileData);
+                return;
+              }
+              fileData.__path__ = filePath;
+              data.push(fileData);
+            });
+          });
+        });
+        // Return for cy.getData(languageCode).then(data => {});
+        return cy.wrap(data);
+      });
+    });
+  } catch {
+    cy.task('log', 'fail');
+  }
+}
+
+Cypress.Commands.add('getBuild', getBuild);
+Cypress.Commands.add('getConfig', getConfig);
+Cypress.Commands.add('getData', getData);

test/e2e/config.cy.js

@@ -0,0 +1,11 @@
+describe('Config', function () {
+
+  beforeEach(function () {
+    cy.getConfig();
+  });
+
+  it('should have a valid direction', function () {
+    expect(this.config._defaultDirection).to.be.oneOf(['ltr', 'rtl']);
+  });
+
+});

test/e2e/languages.cy.js

@@ -0,0 +1,17 @@
+describe('Languages', function () {
+
+  beforeEach(function () {
+    cy.getConfig().then(config => cy.getData(config._defaultLanguage));
+  });
+
+  it('should have the default language', function () {
+    expect(this.build.availableLanguageNames).to.include(this.config._defaultLanguage);
+  });
+
+  it('should have data for all specified languages', function () {
+    this.build.availableLanguageNames.forEach(lang => {
+      cy.getData(lang);
+    });
+  });
+
+});

test/e2e/trackingIds.cy.js

@@ -0,0 +1,22 @@
+describe('Tracking Ids', function () {
+
+  beforeEach(function () {
+    cy.getBuild();
+  });
+
+  it('should have specified tracking ids for all specified languages', function () {
+    const {
+      trackingIdType,
+      availableLanguageNames
+    } = this.build;
+    availableLanguageNames.forEach(lang => {
+      cy.getData(lang).then(data => {
+        const trackingIdItems = data.filter(item => item._type === trackingIdType);
+        trackingIdItems.forEach(item => {
+          expect(item).to.have.ownProperty('_trackingId');
+        });
+      })
+    });
+  });
+
+});