"use strict";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/command.ts
var command_exports = {};
__export(command_exports, {
addCompareSnapshotCommand: () => addCompareSnapshotCommand
});
module.exports = __toCommonJS(command_exports);
function addCompareSnapshotCommand(screenshotOptions) {
Cypress.Commands.add(
"compareSnapshot",
{ prevSubject: ["optional", "element"] },
function(subject, name, commandOptions) {
if (name === void 0 || name === "") {
throw new Error("Snapshot name must be specified");
}
const screenshotOptionsObject = { ...screenshotOptions };
const commandOptionsObject = typeof commandOptions === "number" ? { errorThreshold: commandOptions } : { ...commandOptions };
const visualRegressionOptions = prepareOptions(name, screenshotOptionsObject, commandOptionsObject);
const folderAndName = `${Cypress.spec.relative}/${name}`;
return takeScreenshot(subject, folderAndName, visualRegressionOptions.screenshotOptions).then(
(screenshotPath) => {
visualRegressionOptions.screenshotAbsolutePath = screenshotPath;
visualRegressionOptions.spec = Cypress.spec;
switch (visualRegressionOptions.type) {
case "regression":
return compareScreenshots(subject, visualRegressionOptions);
case "base":
return updateSnapshots(subject, visualRegressionOptions);
default:
throw new Error(
`The 'type' environment variable is invalid. Expected: 'regression' or 'base' instead of '${visualRegressionOptions.type}'`
);
}
}
);
}
);
}
function prepareOptions(name, screenshotOptions, commandOptions) {
if (Cypress.env("visualRegressionType") === void 0) {
throw new Error("The 'type' environment variable is missing. Expected values: 'regression' or 'base'");
}
const defaultCommandOptions = {
errorThreshold: 0,
failSilently: false,
pixelmatchOptions: { threshold: 0.1 }
};
const options = {
type: Cypress.env("visualRegressionType"),
screenshotName: name,
screenshotAbsolutePath: "null",
// will be set after takeScreenshot
pluginOptions: defaultCommandOptions,
screenshotOptions: {},
baseDirectory: "cypress/snapshots/base",
diffDirectory: "cypress/snapshots/diff",
generateDiff: "fail",
spec: Cypress.spec
};
if (screenshotOptions.pixelmatchOptions !== void 0) {
options.pluginOptions.pixelmatchOptions = screenshotOptions.pixelmatchOptions;
}
if (screenshotOptions.errorThreshold !== void 0) {
options.pluginOptions.errorThreshold = screenshotOptions.errorThreshold;
}
if (screenshotOptions.failSilently !== void 0) {
options.pluginOptions.failSilently = screenshotOptions.failSilently;
}
options.screenshotOptions = { ...screenshotOptions, ...commandOptions };
if (Cypress.env("visualRegressionBaseDirectory") !== void 0) {
options.baseDirectory = Cypress.env("visualRegressionBaseDirectory");
}
if (Cypress.env("visualRegressionDiffDirectory") !== void 0) {
options.diffDirectory = Cypress.env("visualRegressionDiffDirectory");
}
if (Cypress.env("visualRegressionGenerateDiff") !== void 0) {
options.generateDiff = Cypress.env("visualRegressionGenerateDiff");
}
if (Cypress.env("visualRegressionFailSilently") !== void 0) {
options.pluginOptions.failSilently = Cypress.env("visualRegressionFailSilently");
}
if (commandOptions.failSilently !== void 0) {
options.pluginOptions.failSilently = commandOptions.failSilently;
}
if (commandOptions.errorThreshold !== void 0) {
options.pluginOptions.errorThreshold = commandOptions.errorThreshold;
}
if (commandOptions.pixelmatchOptions !== void 0) {
options.pluginOptions.pixelmatchOptions = commandOptions.pixelmatchOptions;
}
return options;
}
function takeScreenshot(subject, name, screenshotOptions) {
const objToOperateOn = subject !== void 0 ? cy.get(subject) : cy;
let screenshotDetails;
return objToOperateOn.screenshot(name, {
...screenshotOptions,
log: false,
onAfterScreenshot(_el, props) {
screenshotDetails = props.path;
screenshotOptions?.onAfterScreenshot?.(_el, props);
}
}).then(() => screenshotDetails);
}
function compareScreenshots(subject, options) {
return cy.task("compareSnapshots", options, { log: false }).then((result) => {
const log = Cypress.log({
type: "parent",
name: "compareScreenshots",
displayName: "compareScreenshots",
message: "captureMode: 'fullPage'",
consoleProps: () => {
return {
Options: options,
Result: result
};
}
});
if (subject != null) {
log.set("$el", subject);
log.set("message", subject.selector);
log.set("type", "child");
} else if (options.screenshotOptions?.capture !== void 0) {
log.set("message", `captureMode: ${options.screenshotOptions.capture}`);
}
if (result.error !== void 0 && !options.pluginOptions.failSilently) {
if (result.error.includes("image is different") && top !== null) {
const random = Math.random();
result.error += ` - [Show Difference](#visualRegressionPopup${random})`;
Cypress.$(top.document.body).on("click", `a[href^="#visualRegressionPopup${random}"]`, (e) => {
e.preventDefault();
if (top === null) {
throw Error("Cypress runner not properly initialized");
}
Cypress.$(getVisual(result.images)).appendTo(top.document.body);
if (result.images.diff === void 0) {
Cypress.$("#diffContainer", top.document.body).remove();
}
const popup = Cypress.$("#visualRegressionPopup", top.document.body);
popup.on("click", 'button[data-type="close"]', () => {
popup.remove();
});
popup.on("click", function(e2) {
if (e2.target === this) {
popup.remove();
}
});
return false;
});
}
throw constructCypressError(log, new Error(result.error));
}
return result;
});
}
function updateSnapshots(subject, options) {
return cy.task("updateSnapshot", options, { log: false }).then((result) => {
const log = Cypress.log({
type: "parent",
name: "compareScreenshots",
displayName: "compareScreenshots",
message: "base generation",
consoleProps: () => {
return {
Options: options,
Result: result
};
}
});
if (subject != null) {
log.set("$el", subject);
log.set("type", "child");
}
return result;
});
}
var constructCypressError = (log, err) => {
;
err.onFail = (err2) => log.error(err2);
return err;
};
function getVisual(images) {
return `
`;
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
addCompareSnapshotCommand
});
