dceky 1.0.0-beta.5 → 1.0.2

package/setup/addToGitIgnore.ts

@@ -0,0 +1,47 @@
+/* eslint-disable no-console */
+import { existsSync, readFileSync, writeFileSync } from 'fs';
+import path from 'path';
+
+/**
+ * Ensure gitignore includes the necessary entries for Cypress results
+ * @author Yuen Ler Chow
+ */
+const addToGitIgnore = (): void => {
+  const root = path.join(__dirname, '../..');
+
+  const gitignorePath = path.join(root, '.gitignore');
+
+  const entries = [
+    'cypress-results/',
+    'cypress/downloads',
+    'cypress/screenshots',
+    'cypress/videos',
+  ];
+
+  let gitignoreContent = '';
+  if (existsSync(gitignorePath)) {
+    gitignoreContent = readFileSync(gitignorePath, 'utf8');
+  }
+
+  // Check which entries are missing
+  const missingEntries = entries.filter((entry) => {
+    // Check if entry exists (with or without newline)
+    const regex = new RegExp(`^${entry.replace(/\//g, '\\/')}$`, 'm');
+    return !regex.test(gitignoreContent);
+  });
+
+  // Add missing entries
+  if (missingEntries.length > 0) {
+    if (gitignoreContent && !gitignoreContent.endsWith('\n')) {
+      gitignoreContent += '\n';
+    }
+    gitignoreContent += '\n# Cypress parallel test results (added by dceky)\n';
+    missingEntries.forEach((entry) => {
+      gitignoreContent += `${entry}\n`;
+    });
+    writeFileSync(gitignorePath, gitignoreContent, 'utf8');
+    console.log(`Added ${missingEntries.length} entries to .gitignore`);
+  }
+};
+
+export default addToGitIgnore;

package/setup/checkRequiredFiles.ts

@@ -0,0 +1,62 @@
+/* eslint-disable no-console */
+import { existsSync } from 'fs';
+import path from 'path';
+
+/**
+ * Ensure required configuration files exist in the consumer repo
+ * @author Yuen Ler Chow
+ */
+const checkRequiredFiles = (): void => {
+  const root = path.join(__dirname, '../..');
+
+  const globalsPath = path.join(root, 'cypress/globals');
+  const profilesPath = path.join(root, 'cypress/profiles');
+
+  // Common file extensions to check
+  const extensions = ['.js', '.ts', '.json', '.mjs', '.cjs'];
+
+  // Required global files
+  const requiredGlobals = [
+    'GlobalCredentials',
+    'GlobalResources',
+    'GlobalValues',
+  ];
+
+  // Determine profile file name (default is stage)
+  const profileName = process.env.CYPRESS_PROFILE || 'stage';
+  const requiredProfile = `${profileName}.Profile`;
+
+  // Check for missing files
+  const missingFiles: string[] = [];
+
+  // Check global files
+  requiredGlobals.forEach((file) => {
+    const filePath = path.join(globalsPath, file);
+    const found = extensions.some((ext) => {
+      return existsSync(`${filePath}${ext}`);
+    });
+    if (!found) {
+      missingFiles.push(`cypress/globals/${file}.ts`);
+    }
+  });
+
+  // Check profile file
+  const profileFilePath = path.join(profilesPath, requiredProfile);
+  const profileFound = extensions.some((ext) => {
+    return existsSync(`${profileFilePath}${ext}`);
+  });
+  if (!profileFound) {
+    missingFiles.push(`cypress/profiles/${requiredProfile}.ts`);
+  }
+
+  if (missingFiles.length > 0) {
+    console.error('\nMissing required configuration files in this project:');
+    missingFiles.forEach((file) => {
+      console.error(`  - ${file}`);
+    });
+    console.error('\nPlease create these files before running setup.');
+    process.exit(1);
+  }
+};
+
+export default checkRequiredFiles;

package/setup/genCommandImportFile.ts

@@ -0,0 +1,75 @@
+import fs from 'fs';
+import path from 'path';
+
+/**
+ * Generate an index.ts file that imports and runs all command files in cypress/commands
+ * This should be called from cypress.config.js
+ * @author Yuen Ler Chow
+ */
+const genCommandImportFile = () => {
+  const root = path.join(__dirname, '../..');
+
+  const cypressCommandsDir = path.join(root, 'cypress/commands');
+  const outputFile = path.join(cypressCommandsDir, 'index.ts');
+  const topOfFileComment = '// Auto-generated by dceky - do not edit manually';
+
+  // Check if the directory exists
+  if (!fs.existsSync(cypressCommandsDir)) {
+    // Create the directory
+    fs.mkdirSync(cypressCommandsDir, { recursive: true });
+    // Create an empty file so init doesn't fail
+    fs.writeFileSync(outputFile, `${topOfFileComment}\n`);
+    return outputFile;
+  }
+
+  // Get all files in the directory
+  const files = fs.readdirSync(cypressCommandsDir);
+  const commandFiles: string[] = [];
+
+  // Filter out non-JS/TS files and process each file
+  files.forEach((file) => {
+    // Skip non-JS/TS files (like .d.ts, .map, etc.)
+    if (!file.endsWith('.js') && !file.endsWith('.ts')) {
+      return;
+    }
+
+    // Skip index files
+    if (file === 'index.js' || file === 'index.ts') {
+      return;
+    }
+
+    // Determine the file's path
+    const filePath = path.join(cypressCommandsDir, file);
+
+    // Check if it's a file (not a directory)
+    const stats = fs.statSync(filePath);
+    if (!stats.isFile()) {
+      return;
+    }
+
+    // Store the file name
+    commandFiles.push(file);
+  });
+
+  // Generate require statements and function calls
+  const requires: string[] = [];
+  const calls: string[] = [];
+
+  commandFiles.forEach((file) => {
+    const requirePath = `./${file}`;
+    // Create a safe variable name (replace non-alphanumeric with underscore)
+    const importName = file.replace(/\.(js|ts)$/, '');
+    const varName = importName.replace(/[^a-zA-Z0-9]/g, '_');
+
+    requires.push(`const ${varName} = require('${requirePath}');`);
+    calls.push(`${varName}.default();`);
+  });
+
+  // Build the final content
+  const content = `${topOfFileComment}\n${requires.join('\n')}\n\n${calls.join('\n')}`;
+
+  // Write to the output file
+  fs.writeFileSync(outputFile, content, 'utf8');
+};
+
+export default genCommandImportFile;

package/setup/genDynamicConfigFile.ts

@@ -0,0 +1,28 @@
+import fs from 'fs';
+import path from 'path';
+
+/**
+ * Generate the dynamic configuration file
+ */
+const genDynamicConfigFile = (): string => {
+  const root = path.join(__dirname, '../..');
+
+  const outputFile = path.join(root, 'cypress.config.ts');
+
+  // Create the dynamic configuration file
+  const dynamicConfigFile = [
+    '// Auto-generated by dceky - do not edit manually',
+    '',
+    'import { genConfiguration } from \'dceky\';',
+    '',
+    'export default genConfiguration();',
+    '',
+  ].join('\n');
+
+  // Write the configuration file directly
+  fs.writeFileSync(outputFile, dynamicConfigFile, 'utf8');
+
+  return outputFile;
+};
+
+export default genDynamicConfigFile;

package/setup/index.ts

@@ -0,0 +1,11 @@
+import genCommandImportFile from './genCommandImportFile';
+import genDynamicConfigFile from './genDynamicConfigFile';
+import addToGitIgnore from './addToGitIgnore';
+import setupCypressDependencies from './setupCypressDependencies';
+import checkRequiredFiles from './checkRequiredFiles';
+
+checkRequiredFiles();
+genCommandImportFile();
+genDynamicConfigFile();
+addToGitIgnore();
+setupCypressDependencies();

package/setup/setupCypressDependencies.ts

@@ -0,0 +1,38 @@
+/* eslint-disable no-console */
+import path from 'path';
+
+/**
+ * Ensure required packages exist in the consumer repo
+ * @author Yuen Ler Chow
+ */
+const setupCypressDependencies = (): void => {
+  const root = path.join(__dirname, '../..');
+
+  const requiredPkgs = [
+    'cypress-parallel',
+    'cypress-multi-reporters',
+    'mochawesome',
+    'mochawesome-merge',
+    'mochawesome-report-generator',
+  ];
+
+  const missingPkgs = requiredPkgs.filter((pkg) => {
+    try {
+      // Resolve from the consumer project root
+      require.resolve(pkg, { paths: [root] });
+      return false;
+    } catch {
+      return true;
+    }
+  });
+
+  if (missingPkgs.length > 0) {
+    const installCmd = `npm i -D ${missingPkgs.join(' ')}`;
+    console.error(`\nMissing required devDependencies in this project: ${missingPkgs.join(', ')}`);
+    console.error('Run the following command, then try again:');
+    console.error(`\n${installCmd}\n`);
+    process.exit(1);
+  }
+};
+
+export default setupCypressDependencies;

package/src/commands/assertDoesNotHaveClass.ts

@@ -0,0 +1,51 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Assert that an element does not have a specific className
+       * @author Yuen Ler Chow
+       * @param opts object containing all arguments
+       * @param opts.item the css selector for finding the element
+       * @param opts.className the className to check for
+       * @return Cypress chainable containing the element that was checked
+       */
+      assertDoesNotHaveClass(
+        opts: {
+          item: string,
+          className: string,
+        },
+      ): Chainable<JQuery<HTMLElement>>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const assertDoesNotHaveClass = () => {
+  Cypress.Commands.add(
+    'assertDoesNotHaveClass',
+    (
+      opts: {
+        item: string,
+        className: string,
+      },
+    ) => {
+      cy.log(`Assert ${opts.item} does not have class ${opts.className}`);
+      return cy.get(opts.item).should('not.have.class', opts.className);
+    },
+  );
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default assertDoesNotHaveClass;

package/src/commands/assertHasClass.ts

@@ -0,0 +1,51 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Assert that an element has a specific className
+       * @author Yuen Ler Chow
+       * @param opts object containing all arguments
+       * @param opts.item the css selector for finding the element
+       * @param opts.className the className to check for
+       * @return Cypress chainable containing the element that was checked
+       */
+      assertHasClass(
+        opts: {
+          item: string,
+          className: string,
+        },
+      ): Chainable<JQuery<HTMLElement>>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const assertHasClass = () => {
+  Cypress.Commands.add(
+    'assertHasClass',
+    (
+      opts: {
+        item: string,
+        className: string,
+      },
+    ) => {
+      cy.log(`Assert ${opts.item} has class ${opts.className}`);
+      return cy.get(opts.item).should('have.class', opts.className);
+    },
+  );
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default assertHasClass;

package/src/commands/assertNumElements.ts

@@ -0,0 +1,50 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Assert a certain number of elements
+       * @author Yuen Ler Chow
+       * @param opts object containing all arguments
+       * @param opts.item a CSS selector corresponding to the item
+       * @param opts.num the precise number of elements expected
+       */
+      assertNumElements(
+        opts: {
+          item: string,
+          num: number,
+        }
+      ): Chainable<Element>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const assertNumElements = () => {
+  Cypress.Commands.add(
+    'assertNumElements',
+    (
+      opts: {
+        item: string,
+        num: number,
+      },
+    ) => {
+      cy.log(`Assert ${opts.num} elements match ${opts.item}`);
+      cy.get(opts.item).should('have.length', opts.num);
+    },
+  );
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default assertNumElements;

package/src/commands/extractDataFromClass.ts

@@ -0,0 +1,52 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Obtain data from a class attribute that starts with a specific prefix
+       * and return it
+       * @author Allison Zhang
+       * @param selector the css selector for finding the element
+       * @param classPrefix the prefix to look for in the class attribute
+       * @returns the extracted data
+       * @example cy.extractDataFromClass('.item', 'data-').then((data) => { ... })
+       */
+      extractDataFromClass(
+        selector: string,
+        classPrefix: string,
+      ): Chainable<string[]>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const extractDataFromClass = () => {
+  Cypress.Commands.add('extractDataFromClass', (selector: string, classPrefix: string) => {
+    return (
+      cy
+        .get(selector)
+        .invoke('attr', 'class')
+        .then((classAttr: string) => {
+          const classList = classAttr.split(' ');
+          const data = classList
+            .filter((className) => { return className.startsWith(classPrefix); })
+            .map((className) => { return className.replace(classPrefix, ''); });
+          return data;
+        })
+    );
+  });
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default extractDataFromClass;

package/src/commands/extractDataFromClassByContents.ts

@@ -0,0 +1,55 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Obtain data from a class attribute that starts with a specific prefix
+       * and with specific contents, and return it
+       * @author Allison Zhang
+       * @param contents the contents of the element to find
+       * @param selector the css selector for finding the element
+       * @param classPrefix the prefix to look for in the class attribute
+       * @returns the extracted data
+       * @example cy.extractDataFromClassByContents('Submit', '.button', 'btn-').then((data) => { ... })
+       */
+      extractDataFromClassByContents(
+        contents: string,
+        selector: string,
+        classPrefix: string,
+      ): Chainable<string[]>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const extractDataFromClassByContents = () => {
+  Cypress.Commands.add('extractDataFromClassByContents', (contents: string, selector: string, classPrefix: string) => {
+    return (
+      cy
+        .get(selector)
+        .contains(contents)
+        .invoke('attr', 'class')
+        .then((classAttr: string) => {
+          const classList = classAttr.split(' ');
+          const data = classList
+            .filter((className) => { return className.startsWith(classPrefix); })
+            .map((className) => { return className.replace(classPrefix, ''); });
+          return data;
+        })
+    );
+  });
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default extractDataFromClassByContents;

package/src/commands/getJSON.ts

@@ -0,0 +1,45 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Obtain JSON data from a request and return it.
+       * @author Allison Zhang
+       * @param url the URL to fetch the JSON data from
+       * @returns the JSON data
+       * @example cy.getJSON('https://api.example.com/data').then((data) => { ... })
+       */
+      getJSON(
+        url: string,
+      ): Chainable<any>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const getJSON = () => {
+  Cypress.Commands.add('getJSON', (url: string) => {
+    return (
+      cy
+        .request(url)
+        .its('body')
+        .then((body) => {
+          return body;
+        })
+    );
+  });
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default getJSON;

package/src/commands/getNumElements.ts

@@ -0,0 +1,45 @@
+/// <reference types="cypress" />
+
+/*----------------------------------------*/
+/* ---------------- Type ---------------- */
+/*----------------------------------------*/
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      /**
+       * Get number of elements
+       * @author Yuen Ler Chow
+       * @param selector a CSS selector corresponding to the item to count
+       * @return Cypress chainable containing the number of elements matching the selector
+       */
+      getNumElements(
+        selector: string,
+      ): Chainable<number>;
+    }
+  }
+}
+
+/*----------------------------------------*/
+/* --------------- Command -------------- */
+/*----------------------------------------*/
+
+const getNumElements = () => {
+  Cypress.Commands.add(
+    'getNumElements',
+    (
+      selector: string,
+    ) => {
+      cy.log(`Count elements matching ${selector}`);
+      return cy.get(selector).then(($elements: JQuery<HTMLElement>) => {
+        return Cypress.$($elements).length;
+      });
+    },
+  );
+};
+
+/*----------------------------------------*/
+/* --------------- Export --------------- */
+/*----------------------------------------*/
+
+export default getNumElements;