@forsakringskassan/cypress-config 1.4.1 → 1.5.1

package/dist/index.d.ts

@@ -25,8 +25,8 @@ export declare type ConfigOptions = Parameters<typeof defineConfig_2>[0];
  * @public
  * @since v1.1.0
  */
-export declare const defaultConfig: Readonly<{
-    allowCypressEnv: false;
+export declare function defaultConfig(cypressMajor: string | undefined): Readonly<{
+    allowCypressEnv?: false;
     video: false;
     defaultBrowser: string;
     reporter: string;

package/dist/index.mjs

@@ -133,40 +133,7 @@ var require_cjs = __commonJS({
 
 // src/plugins/axe.ts
 import "cypress";
-
-// node_modules/@forsakringskassan/cypress-axe/dist/esm/plugins.js
-import fs from "node:fs";
-import { createRequire } from "node:module";
-var localConfig = null;
-var tasks = {
-  // Allows access to regular log output
-  axeReportLog(message) {
-    console.log(message);
-    return null;
-  },
-  axeGetInjectorSource() {
-    const require4 = createRequire(import.meta.url);
-    const scriptPath = require4.resolve("axe-core/axe.min.js");
-    return fs.readFileSync(scriptPath, "utf8");
-  },
-  getLocalConfig() {
-    return localConfig;
-  }
-};
-function init(on, config, userOptions = void 0) {
-  on("task", tasks);
-  if (userOptions !== void 0) {
-    localConfig = userOptions;
-    return config;
-  }
-  try {
-    localConfig = JSON.parse(fs.readFileSync("fk-cypress-axe.json", {
-      encoding: "utf8"
-    }));
-  } catch {
-  }
-  return config;
-}
+import { init as install } from "@forsakringskassan/cypress-axe/plugins";
 
 // src/utils/merge-config.ts
 var import_deepmerge = __toESM(require_cjs(), 1);
@@ -191,7 +158,7 @@ var defaultOptions = {
 };
 function axePlugin(on, config, userOptions) {
   const options = mergeConfig(defaultOptions, userOptions);
-  config = init(on, config, options);
+  config = install(on, config, options);
   return Promise.resolve(config);
 }
 
@@ -206,10 +173,10 @@ async function docsGeneratorPlugin(_on, config, docs, sourceFiles) {
 }
 
 // src/plugins/html-validate.ts
-import { createRequire as createRequire2 } from "node:module";
+import { createRequire } from "node:module";
 import "cypress";
-import { install } from "cypress-html-validate/plugin";
-var require2 = createRequire2(import.meta.url);
+import { install as install2 } from "cypress-html-validate/plugin";
+var require2 = createRequire(import.meta.url);
 var exclude = [];
 try {
   exclude = require2("@fkui/vue/htmlvalidate/cypress");
@@ -253,42 +220,55 @@ var htmlValidateOptions = () => {
 function htmlValidatePlugin(on, cypressConfig, userConfig, userOptions) {
   const config = mergeConfig(htmlValidateConfig(), userConfig);
   const options = mergeConfig(htmlValidateOptions(), userOptions);
-  install(on, config, options);
+  install2(on, config, options);
   return Promise.resolve(cypressConfig);
 }
 
 // src/default-config.ts
-import { createRequire as createRequire3 } from "node:module";
-var require3 = createRequire3(import.meta.url);
+import { createRequire as createRequire2 } from "node:module";
+var require3 = createRequire2(import.meta.url);
 var isGithub = Boolean(process.env["GITHUB_ACTION"]);
-var defaultConfig = Object.freeze({
-  allowCypressEnv: false,
-  /* disable video recording, it is to slow both on remote machines and on
-   * CI/CD testing. */
-  video: false,
-  /* use chrome instead of electron as default browser */
-  defaultBrowser: "chrome",
-  /* reporter configuration */
-  reporter: require3.resolve("mocha-multi-reporters"),
-  reporterOptions: {
-    reporterEnabled: isGithub ? "spec, github-actions, mocha-junit-reporter" : "spec, mocha-junit-reporter",
-    mochaJunitReporterReporterOptions: {
-      mochaFile: "test-results/cypress-test-output_[hash].xml"
-    }
-  },
-  component: {
-    devServer: {
-      framework: "vue",
-      bundler: "vite"
-    },
-    indexHtmlFile: require3.resolve("#assets/component-index.html")
+var versionConfig = Object.freeze({
+  "15": {
+    /* @ts-expect-error until we drop support for cypress 15 we still want to set this option (removed in cypress 16 and later) */
+    allowCypressEnv: false
   }
 });
+function hasVersionConfig(key) {
+  return Boolean(key && Object.hasOwn(versionConfig, key));
+}
+function defaultConfig(cypressMajor2) {
+  return Object.freeze({
+    ...hasVersionConfig(cypressMajor2) && versionConfig[cypressMajor2],
+    /* disable video recording, it is to slow both on remote machines and on
+     * CI/CD testing. */
+    video: false,
+    /* use chrome instead of electron as default browser */
+    defaultBrowser: "chrome",
+    /* reporter configuration */
+    reporter: require3.resolve("mocha-multi-reporters"),
+    reporterOptions: {
+      reporterEnabled: isGithub ? "spec, github-actions, mocha-junit-reporter" : "spec, mocha-junit-reporter",
+      mochaJunitReporterReporterOptions: {
+        mochaFile: "test-results/cypress-test-output_[hash].xml"
+      }
+    },
+    component: {
+      devServer: {
+        framework: "vue",
+        bundler: "vite"
+      },
+      indexHtmlFile: require3.resolve("#assets/component-index.html")
+    }
+  });
+}
 
 // src/define-config.ts
+import pkg from "cypress/package.json";
+var cypressMajor = pkg.version.split(".", 2).at(0);
 function defineConfig(_rootDir, userConfig) {
   return mergeConfig(
-    defaultConfig,
+    defaultConfig(cypressMajor),
     userConfig
   );
 }

package/dist/support.mjs

@@ -1,465 +1,5 @@
-// node_modules/@forsakringskassan/cypress-axe/dist/esm/support.js
-var defaultConfig = {
-  axe: {
-    rules: [
-      //Disable color contrast rule
-      {
-        id: "color-contrast",
-        enabled: false
-      }
-    ]
-  },
-  /**
-   * Context object to pass to axe. If not set `window.document` is passed.
-   *
-   * Can be set to:
-   *
-   *   - CSS selector with root element.
-   *   - An object `{include: string[][], exclude: string[][]}`
-   *
-   * Example:
-   *
-   * "context": {
-   *   "include": [["#app"]],
-   *   "exclude": [[".selector1"], [".selector2"]]
-   * }
-   *
-   * See
-   * https://www.deque.com/axe/axe-for-web/documentation/api-documentation/#context-parameter
-   * for a longer description.
-   */
-  context: null,
-  assertOnViolation: true,
-  // Stoppar resterande tester så fort ett misslyckas. (Annars rapporteras även felaktiga testfall som lyckade).
-  displayHelpUrl: true,
-  // Visar aXe help URL tillsammans med felet. Default true.
-  displayContext: true,
-  // Visar sammanhang (CSS selector, HTML, Förslag till rättelse, osv.)
-  displayPasses: false,
-  // Visar även passes. Default false
-  displayViolations: true,
-  // Visar felen. Default true.
-  standardsToReport: ["wcag2a", "wcag2aa"],
-  // Lista med standarder som kontrolleras. Om listan är tom visas valideras samtliga standarder.
-  ignoreAxeFailures: false,
-  // Ignorera Axe-valideringsfel. Default false
-  displayWhen: "both",
-  // När felen ska visas ("immediate", "end", "both")
-  excludeSelectorsList: []
-  // Lista med eventuella CSS selectorer som ska undantas från tillgänglighetskontrollerna
-};
-var Attribute = {
-  ColorCodes: {
-    red: "\x1B[31m",
-    grey: "\x1B[37m",
-    white: "\x1B[37;1m",
-    normalColor: "\x1B[39m",
-    indent: "",
-    green: "\x1B[32m",
-    yellow: "\x1B[33m",
-    magenta: "\x1B[35m",
-    cyan: "\x1B[36m",
-    resetColor: "\x1B[0m",
-    bold: "\x1B[1m",
-    underline: "\x1B[4m",
-    reversed: "\x1B[7m"
-  },
-  red(message) {
-    return `${this.ColorCodes.red}${message}${this.ColorCodes.resetColor}`;
-  },
-  grey(message) {
-    return `${this.ColorCodes.grey}${message}${this.ColorCodes.resetColor}`;
-  },
-  white(message) {
-    return `${this.ColorCodes.white}${message}${this.ColorCodes.resetColor}`;
-  },
-  green(message) {
-    return `${this.ColorCodes.green}${message}${this.ColorCodes.resetColor}`;
-  },
-  yellow(message) {
-    return `${this.ColorCodes.yellow}${message}${this.ColorCodes.resetColor}`;
-  },
-  magenta(message) {
-    return `${this.ColorCodes.magenta}${message}${this.ColorCodes.resetColor}`;
-  },
-  cyan(message) {
-    return `${this.ColorCodes.cyan}${message}${this.ColorCodes.resetColor}`;
-  },
-  bold(message) {
-    return `${this.ColorCodes.bold}${message}${this.ColorCodes.resetColor}`;
-  },
-  underline(message) {
-    return `${this.ColorCodes.underline}${message}${this.ColorCodes.resetColor}`;
-  },
-  reversed(message) {
-    return `${this.ColorCodes.reversed}${message}${this.ColorCodes.resetColor}`;
-  }
-};
-var cachedLocalConfig = null;
-var globalResults = {
-  passes: { enabled: [], disabled: [] },
-  violations: { enabled: [], disabled: [] }
-};
-function nodeLog(message) {
-  cy.task("axeReportLog", message, { log: false });
-}
-function getInjectorSource() {
-  return cy.task("axeGetInjectorSource", null, { log: false });
-}
-function validateConfig(config) {
-  const errors = [];
-  for (const key of Object.keys(config)) {
-    if (defaultConfig[key] === void 0) {
-      errors.push(`- The field "${key}" is not a valid configuration option.`);
-    }
-  }
-  if (config.displayWhen !== "immediate" && config.displayWhen !== "end" && config.displayWhen !== "both") {
-    errors.push(`- "displayWhen" can only be set to "immediate", "end", or "both" (was: ${config.displayWhen}).`);
-  }
-  if (errors.length > 0) {
-    nodeLog(Attribute.reversed(Attribute.red(`Invalid fk-cypress-axe configuration!`)));
-    for (const error of errors) {
-      nodeLog(Attribute.red(error));
-    }
-    nodeLog(Attribute.red(`As a result, some tests may be omitted or displayed when they shouldn't be!`));
-  }
-}
-function getConfig() {
-  const localConfig = cachedLocalConfig;
-  if (!localConfig) {
-    return defaultConfig;
-  }
-  const finalConfig = { ...defaultConfig, ...localConfig };
-  if (localConfig.axe) {
-    finalConfig.axe = {
-      ...defaultConfig.axe,
-      ...localConfig.axe
-    };
-    if (localConfig.axe.rules) {
-      finalConfig.axe.rules = [
-        ...defaultConfig.axe.rules.filter((defaultRule) => {
-          return localConfig.axe.rules.every((parsedRule) => {
-            return parsedRule.id !== defaultRule.id;
-          });
-        }),
-        ...localConfig.axe.rules
-      ];
-    }
-  }
-  validateConfig(finalConfig);
-  return finalConfig;
-}
-function prepareAxe() {
-  getInjectorSource().then((source) => cy.window({ log: false }).then((window) => {
-    window.eval(source);
-    if (!window.axe) {
-      nodeLog(Attribute.red(Attribute.reversed("AXE COULD NOT BE LOADED")) + Attribute.red("\nAxe was likely injected before cy.visit or incorrectly processed"));
-    }
-  }));
-}
-function filterResultsByStandardTags(results, standardTags) {
-  const filteredResults = {
-    enabled: [],
-    disabled: []
-  };
-  if (standardTags.length === 0) {
-    filteredResults.enabled = results;
-    return filteredResults;
-  }
-  const isStandardTag2 = (tag) => {
-    return standardTags.includes(tag);
-  };
-  filteredResults.enabled = results.filter((result) => {
-    return result.tags.some(isStandardTag2);
-  });
-  filteredResults.disabled = results.filter((result) => {
-    return !result.tags.some(isStandardTag2);
-  });
-  return filteredResults;
-}
-function filterResultsByExcludedSelectors(results, excludedSelectors) {
-  const filteredResults = {
-    enabled: [],
-    disabled: []
-  };
-  const isExcluded = (selector) => {
-    return excludedSelectors.includes(selector);
-  };
-  filteredResults.enabled = results.filter((result) => {
-    return result.nodes.some((node) => {
-      return !node.target.some(isExcluded);
-    });
-  });
-  filteredResults.disabled = results.filter((result) => {
-    return result.nodes.some((node) => {
-      return node.target.some(isExcluded);
-    });
-  });
-  return filteredResults;
-}
-function impactToPriority(impact) {
-  switch (impact) {
-    case "minor":
-      return 3;
-    case "moderate":
-      return 2;
-    case "serious":
-      return 1;
-    case "critical":
-      return 0;
-    default:
-      return 4;
-  }
-}
-function formatSuggestions(suggestions) {
-  return suggestions.reduce((msg, line) => {
-    return `${msg}
-					* ${line.replace("\n", "").trim()}`;
-  });
-}
-function formatHTML(html) {
-  return html.reduce((msg, line) => {
-    return `${msg}
-			  ${line.replace("\n", "")}`;
-  });
-}
-function formatTarget(target) {
-  return target.reduce((msg, target2) => {
-    return `${msg} ${target2}`;
-  });
-}
-var isStandardTag = (tag) => {
-  const config = getConfig();
-  return config.standardsToReport.includes(tag);
-};
-function formatTags(tags) {
-  return tags.reduce((msg, tag) => {
-    if (isStandardTag(tag)) {
-      return `${msg}, ${Attribute.green(tag)}`;
-    }
-    return `${msg}, ${tag}`;
-  });
-}
-function printContextField(name, value, withBullet) {
-  name = `${name}:`.padEnd(14);
-  let bullet = ``;
-  if (withBullet) {
-    bullet = `*`;
-  }
-  nodeLog(`		${bullet}	${name}${value}`);
-}
-function displayContext(violation, config) {
-  cy.wrap(violation.nodes, { log: false }).each((node) => {
-    const context = {
-      ["CSS Selector"]: formatTarget(node.target),
-      ["HTML"]: formatHTML(node.html.split("\n")),
-      ["Suggestions"]: formatSuggestions(node.failureSummary.split("\n")),
-      ["Standards"]: formatTags(violation.tags)
-    };
-    let withBullet = true;
-    for (const [key, value] of Object.entries(context)) {
-      if (config.displayContext !== true) {
-        continue;
-      }
-      printContextField(key, value, withBullet);
-      withBullet = false;
-    }
-    const log = Cypress.log({
-      name: `(${violation.impact}) ACCESSIBILITY VIOLATION`,
-      consoleProps: () => context,
-      message: violation.help
-    });
-    cy.get(context["CSS Selector"], { log: false }).then(($el) => {
-      log.set({ $el }).snapshot().end();
-    });
-  });
-}
-function printPass(pass, config) {
-  let messageTemplate = ` ${pass.help}`;
-  if (config.displayHelpUrl) {
-    messageTemplate += `
-		${pass.helpUrl}`;
-  }
-  nodeLog(`	${Attribute.green(Attribute.reversed(" PASS "))}${Attribute.green(messageTemplate)}: [${pass.id}]`);
-}
-function printViolation(violation, config) {
-  const impactPriority = impactToPriority(violation.impact);
-  let messageTemplate = ` (${violation.impact}) ${violation.help}`;
-  if (config.displayHelpUrl) {
-    messageTemplate += `
-		${violation.helpUrl}`;
-  }
-  if (impactPriority <= 1) {
-    nodeLog(`	${Attribute.red(Attribute.reversed(" FAIL "))}${Attribute.red(messageTemplate)}: [${violation.id}]`);
-  } else if (impactPriority <= 2) {
-    nodeLog(`	${Attribute.yellow(Attribute.reversed(` FAIL `))}${Attribute.yellow(messageTemplate)}: [${violation.id}]`);
-  } else {
-    nodeLog(`	${Attribute.magenta(Attribute.reversed(` FAIL `))}${Attribute.magenta(messageTemplate)}: [${violation.id}]`);
-  }
-}
-var impactComparator = (a, b) => {
-  const aImpact = impactToPriority(a.impact);
-  const bImpact = impactToPriority(b.impact);
-  return Math.sign(aImpact - bImpact);
-};
-function processResults(results, config) {
-  results.sort(impactComparator);
-  const postPass1 = filterResultsByStandardTags(results, config.standardsToReport);
-  const postPass2 = filterResultsByExcludedSelectors(postPass1.enabled, config.excludeSelectorsList);
-  return {
-    enabled: postPass2.enabled,
-    disabled: [...postPass1.disabled, ...postPass2.disabled]
-  };
-}
-function displayPasses(passes, config) {
-  if (!config.displayPasses || passes.enabled.length === 0) {
-    return;
-  }
-  for (const pass of passes.enabled) {
-    printPass(pass, config);
-  }
-}
-function displayViolations(violations, config, withTitle) {
-  if (!config.displayViolations || violations.enabled.length === 0) {
-    return;
-  }
-  if (violations.enabled.length > 0) {
-    if (withTitle) {
-      const testName = Cypress.mocha.getRunner()?.suite?.ctx?.currentTest?.title ?? "";
-      nodeLog(Attribute.red(`	[${violations.enabled.length} Accessibility violation(s) were detected after `) + Attribute.red(Attribute.underline(`"${testName}"`)) + Attribute.red(`]`));
-    }
-    for (const violation of violations.enabled) {
-      printViolation(violation, config);
-      if (config.displayContext) {
-        displayContext(violation, config);
-      }
-    }
-  } else {
-    nodeLog(Attribute.green(`	All enabled tests passed!`));
-  }
-}
-function anythingToDisplay(config, passes, violations) {
-  const { displayPasses: displayPasses2, displayViolations: displayViolations2 } = config;
-  const numPasses = passes.enabled.length;
-  const numViolations = violations.enabled.length;
-  const anyPasses = displayPasses2 && numPasses > 0;
-  const anyViolations = displayViolations2 && numViolations > 0;
-  return anyPasses || anyViolations;
-}
-function runAxe() {
-  Cypress.log({
-    name: "fk-cypress-axe",
-    displayName: "Axe",
-    message: ["Running accessibility tests"]
-  });
-  const config = getConfig();
-  if (config.ignoreAxeFailures === true) {
-    return;
-  }
-  cy.window({ log: false }).then((window) => {
-    window.axe.configure(config.axe);
-    return window.axe.run(config.context || window.document);
-  }).then(({ passes, violations }) => {
-    passes = processResults(passes, config);
-    violations = processResults(violations, config);
-    const displayNow = config.displayWhen === "immediate" || config.displayWhen === "both";
-    globalResults.passes.enabled = globalResults.passes.enabled.concat(passes.enabled);
-    globalResults.passes.disabled = globalResults.passes.disabled.concat(passes.disabled);
-    globalResults.violations.enabled = globalResults.violations.enabled.concat(violations.enabled);
-    globalResults.violations.disabled = globalResults.violations.disabled.concat(violations.disabled);
-    if (displayNow && anythingToDisplay(config, passes, violations)) {
-      nodeLog("	Accessibility results:");
-      displayPasses(passes, config);
-      displayViolations(violations, config, true);
-      nodeLog("");
-    }
-    return cy.wrap(violations, { log: false });
-  }).then((violations) => {
-    if (config.assertOnViolation) {
-      assert.equal(violations.enabled.length, 0, `${violations.enabled.length} A11y problems were detected`, { log: false });
-    }
-  });
-}
-function removeDuplicates(results) {
-  let finalResults = JSON.parse(JSON.stringify(results));
-  for (const [index, result] of finalResults.entries()) {
-    const foundIndex = finalResults.findIndex((v) => {
-      return v.help === result.help;
-    });
-    if (foundIndex !== index) {
-      finalResults[foundIndex].nodes = finalResults[foundIndex].nodes.concat(result.nodes);
-      finalResults[index].toBeRemoved = true;
-    }
-  }
-  finalResults = finalResults.filter((result) => {
-    return !result.toBeRemoved;
-  });
-  for (const result of finalResults) {
-    for (const [index, node] of result.nodes.entries()) {
-      const foundIndex = result.nodes.findIndex((n) => {
-        return n.html === node.html;
-      });
-      if (foundIndex !== index) {
-        result.nodes[index].toBeRemoved = true;
-      }
-    }
-    result.nodes = result.nodes.filter((n) => {
-      return !n.toBeRemoved;
-    });
-  }
-  return finalResults;
-}
-Cypress.Commands.add("getAxeConfigThisFile", () => {
-  const config = getConfig();
-  return cy.wrap(config);
-});
-Cypress.Commands.add("setAxeConfigThisFile", (userConfig) => {
-  cachedLocalConfig = userConfig;
-  return cy.wrap(userConfig);
-});
-Cypress.Commands.add("enableAxeFailures", () => {
-  const config = getConfig();
-  config.ignoreAxeFailures = false;
-  cachedLocalConfig = config;
-});
-Cypress.Commands.add("disableAxeFailures", () => {
-  const config = getConfig();
-  config.ignoreAxeFailures = true;
-  cachedLocalConfig = config;
-});
-Cypress.Commands.add("axe", () => {
-  prepareAxe();
-  runAxe();
-});
-before(() => {
-  cy.task("getLocalConfig", null, { log: false }).then((config) => {
-    cachedLocalConfig = config;
-  });
-});
-afterEach(() => {
-  cy.axe();
-});
-after(() => {
-  const config = getConfig();
-  const displayNow = config.displayWhen === "end" || config.displayWhen === "both";
-  if (config.ignoreAxeFailures === false && displayNow) {
-    globalResults.passes.enabled = removeDuplicates(globalResults.passes.enabled);
-    globalResults.passes.disabled = removeDuplicates(globalResults.passes.disabled);
-    globalResults.violations.enabled = removeDuplicates(globalResults.violations.enabled);
-    globalResults.violations.disabled = removeDuplicates(globalResults.violations.disabled);
-    globalResults.passes.enabled = globalResults.passes.enabled.filter((pass) => {
-      return globalResults.violations.enabled.every((violation) => {
-        return pass.id !== violation.id;
-      });
-    });
-    const { passes, violations } = globalResults;
-    if (anythingToDisplay(config, passes, violations)) {
-      nodeLog(Attribute.reversed(Attribute.yellow("---------------Accessibility Summary----------------")));
-      displayPasses(passes, config);
-      displayViolations(violations, config, false);
-    }
-  }
-});
+// src/support/axe.ts
+import "@forsakringskassan/cypress-axe/support";
 
 // src/support/html-validate.ts
 import "cypress-html-validate/commands";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@forsakringskassan/cypress-config",
-  "version": "1.4.1",
+  "version": "1.5.1",
   "description": "Sharable Cypress configuration building blocks for Försäkringskassan",
   "keywords": [
     "cypress"
@@ -40,13 +40,14 @@
     "dist"
   ],
   "dependencies": {
+    "@forsakringskassan/cypress-axe": "5.1.5",
     "cypress-html-validate": "9.1.0",
     "mocha-multi-reporters": "1.5.1"
   },
   "peerDependencies": {
     "@fkui/vue": ">= 6.0.0",
     "@forsakringskassan/docs-generator": "^3.0.0",
-    "cypress": "^15.17.0",
+    "cypress": "^15.17.0 || ^16.0.0",
     "html-validate": ">= 8.0.0"
   },
   "peerDependenciesMeta": {