comparadise-utils 0.0.10 → 0.0.12

package/dist/images.d.ts

@@ -6,6 +6,6 @@ import { PNG } from 'pngjs';
  * @param {string} actualPath - Full file path to new image
  */
 export declare function getDiffPixels(basePath: string, actualPath: string): {
-    diffPixels: any;
+    diffPixels: number;
     diff: PNG;
 };

package/dist/images.js

@@ -22,11 +22,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __setModuleDefault(result, mod);
     return result;
 };
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getDiffPixels = void 0;
 const fs = __importStar(require("fs"));
 const pngjs_1 = require("pngjs");
-const pixelmatch = require('pixelmatch');
+const pixelmatch_1 = __importDefault(require("pixelmatch"));
 const PIXELMATCH_OPTIONS = {
     threshold: 0.3
 };
@@ -48,7 +51,7 @@ const fillSizeDifference = (width, height) => (image) => {
     for (let y = 0; y < image.height; y++) {
         for (let x = 0; x < image.width; x++) {
             if (inArea(x, y)) {
-                const idx = ((image.width * y) + x) << 2;
+                const idx = (image.width * y + x) << 2;
                 image.data[idx] = 0;
                 image.data[idx + 1] = 0;
                 image.data[idx + 2] = 0;
@@ -76,7 +79,7 @@ function alignImagesToSameSize(firstImage, secondImage) {
     // Fill resized area with black transparent pixels
     return [
         fillSizeDifference(firstImageWidth, firstImageHeight)(resizedFirst),
-        fillSizeDifference(secondImageWidth, secondImageHeight)(resizedSecond),
+        fillSizeDifference(secondImageWidth, secondImageHeight)(resizedSecond)
     ];
 }
 /**
@@ -88,13 +91,10 @@ function alignImagesToSameSize(firstImage, secondImage) {
 function getDiffPixels(basePath, actualPath) {
     const rawBase = pngjs_1.PNG.sync.read(fs.readFileSync(basePath));
     const rawActual = pngjs_1.PNG.sync.read(fs.readFileSync(actualPath));
-    const hasSizeMismatch = (rawBase.height !== rawActual.height
-        || rawBase.width !== rawActual.width);
-    const [base, actual] = hasSizeMismatch
-        ? alignImagesToSameSize(rawBase, rawActual)
-        : [rawBase, rawActual];
+    const hasSizeMismatch = rawBase.height !== rawActual.height || rawBase.width !== rawActual.width;
+    const [base, actual] = hasSizeMismatch ? alignImagesToSameSize(rawBase, rawActual) : [rawBase, rawActual];
     const diff = new pngjs_1.PNG({ width: base.width, height: base.height });
-    const diffPixels = pixelmatch(actual.data, base.data, diff.data, diff.width, diff.height, PIXELMATCH_OPTIONS);
+    const diffPixels = (0, pixelmatch_1.default)(actual.data, base.data, diff.data, diff.width, diff.height, PIXELMATCH_OPTIONS);
     return { diffPixels, diff };
 }
 exports.getDiffPixels = getDiffPixels;

package/dist/match-screenshot.d.ts

@@ -7,9 +7,9 @@ declare function getTestFolderPathFromScripts(rawName?: string): {
     name: string;
     screenshotsFolder: string;
 };
-interface MatchScreenshotArgs {
+declare function verifyImages(): void;
+type MatchScreenshotArgs = {
     rawName?: string;
     options?: Partial<Cypress.ScreenshotOptions>;
-}
-declare function verifyImages(): void;
+};
 declare function matchScreenshot(subject: Cypress.JQueryWithSelector | Window | Document | void, args?: MatchScreenshotArgs): void;

package/dist/match-screenshot.js

@@ -3,7 +3,7 @@ const PREFIX_DIFFERENTIATOR = '___';
 const SUFFIX_TEST_IDENTIFIER = '.spec.ts';
 const SCREENSHOTS_FOLDER_NAME = 'screenshots';
 function forceFont() {
-    const iframe = window.parent.document.querySelector("iframe");
+    const iframe = window.parent.document.querySelector('iframe');
     const contentDocument = iframe && iframe.contentDocument;
     if (contentDocument) {
         const style = contentDocument.createElement('style');
@@ -19,10 +19,8 @@ function getTestFolderPathFromScripts(rawName) {
     if (!relativeTestPath) {
         throw new Error('❌ Could not find matching script in the Cypress DOM to infer the test folder path');
     }
-    // i.e. payment-card-cvvdialog
     const testName = relativeTestPath.substring(relativeTestPath.lastIndexOf('/') + 1, relativeTestPath.lastIndexOf(SUFFIX_TEST_IDENTIFIER));
     const name = rawName || testName;
-    // i.e. screenshots/packages/flights/forced-choice/test/visual/forced-choice/payment-card-cvvdialog
     const screenshotsFolder = `${SCREENSHOTS_FOLDER_NAME}/${relativeTestPath.substring(0, relativeTestPath.lastIndexOf(testName))}${name}`;
     return {
         name,
@@ -31,12 +29,14 @@ function getTestFolderPathFromScripts(rawName) {
 }
 function verifyImages() {
     if (Cypress.$('img:visible').length > 0) {
-        cy.document().its('body').find('img').filter(':visible').then((images) => {
+        cy.document()
+            .its('body')
+            .find('img')
+            .filter(':visible')
+            .then(images => {
             if (images) {
-                cy.wrap(images).each(($img) => {
-                    cy.wrap($img)
-                        .should('exist')
-                        .and('have.prop', 'naturalWidth');
+                cy.wrap(images).each($img => {
+                    cy.wrap($img).should('exist').and('have.prop', 'naturalWidth');
                 });
             }
         });
@@ -49,7 +49,7 @@ function matchScreenshot(subject, args) {
     // Making sure each image is visible before taking screenshots
     verifyImages();
     const { name, screenshotsFolder } = getTestFolderPathFromScripts(rawName);
-    cy.task('baseExists', screenshotsFolder).then((hasBase) => {
+    cy.task('baseExists', screenshotsFolder).then(hasBase => {
         const type = 'new';
         const target = subject ? cy.wrap(subject) : cy;
         // For easy slicing of path ignoring the root screenshot folder
@@ -58,17 +58,16 @@ function matchScreenshot(subject, args) {
             cy.task('createNewScreenshot', screenshotsFolder).then(() => {
                 cy.task('log', `✅ A new base image was created for ${name}. Create this as a new base image via Comparadise!`);
             });
+            return;
         }
-        cy.task('compareScreenshots', screenshotsFolder).then((diffPixels) => {
+        cy.task('compareScreenshots', screenshotsFolder).then(diffPixels => {
             if (diffPixels === 0) {
                 cy.log(`✅ Actual image of ${name} was the same as base`);
-                return null;
             }
-            const screenshotUrl = Cypress.env('BUILD_URL') ? `${Cypress.env('BUILD_URL')}artifact/${screenshotsFolder}` : screenshotsFolder;
-            cy.task('log', `❌ Actual image of ${name} differed by ${diffPixels} pixels.
-             See the diff image for more details >>  ${screenshotUrl}/diff.png`);
+            else {
+                cy.task('log', `❌ Actual image of ${name} differed by ${diffPixels} pixels.`);
+            }
         });
-        return null;
     });
 }
 Cypress.Commands.add('matchScreenshot', { prevSubject: ['optional', 'element', 'window', 'document'] }, matchScreenshot);

package/dist/screenshots.d.ts

@@ -5,13 +5,13 @@
  * @returns true if path/base.png exists, false if not.
  */
 export declare function baseExists(path: string): boolean;
-export declare function createNewScreenshot(screenshotFolder: string): null;
+export declare function createNewScreenshot(screenshotFolder: string): void;
 /**
  * Runs a visual regression test.
  * @param screenshotFolder - Full screenshots folder where the base/new/diff
  *                           images will be compared and written to.
  */
-export declare function compareScreenshots(screenshotFolder: string): any;
+export declare function compareScreenshots(screenshotFolder: string): number;
 /**
  * Renames all root cypress screenshots to where the test was actually run.
  * Should NOT be used standalone. Works with the matchScreenshot task.

package/dist/screenshots.js

@@ -44,12 +44,11 @@ function baseExists(path) {
 exports.baseExists = baseExists;
 function createNewScreenshot(screenshotFolder) {
     const newImage = pngjs_1.PNG.sync.read(fs.readFileSync((0, files_1.createImageFileName)(screenshotFolder, 'new')));
-    fs.writeFile((0, files_1.createImageFileName)(screenshotFolder, 'new'), pngjs_1.PNG.sync.write(newImage), (err) => {
+    fs.writeFile((0, files_1.createImageFileName)(screenshotFolder, 'new'), pngjs_1.PNG.sync.write(newImage), err => {
         if (err) {
             console.error('❌Unable to create new.png', err);
         }
     });
-    return null;
 }
 exports.createNewScreenshot = createNewScreenshot;
 /**
@@ -63,17 +62,17 @@ function compareScreenshots(screenshotFolder) {
     const { diffPixels, diff } = (0, images_1.getDiffPixels)(basePath, actualPath);
     if (diffPixels) {
         // Create diff.png next to base and new for review
-        fs.writeFile((0, files_1.createImageFileName)(screenshotFolder, 'diff'), pngjs_1.PNG.sync.write(diff), (err) => {
+        fs.writeFile((0, files_1.createImageFileName)(screenshotFolder, 'diff'), pngjs_1.PNG.sync.write(diff), err => {
             if (err) {
-                console.error('❌Diff exists but unable to create diff.png', err);
+                console.error('❌ Diff exists but unable to create diff.png', err);
             }
         });
     }
     else {
         // Delete created new.png. Not needed if there's no diff
-        fs.unlink(actualPath, (err) => {
+        fs.unlink(actualPath, err => {
             if (err) {
-                console.error('❌No diff but unable to deleteactualPath}', err);
+                console.error('❌ No diff but unable to delete actualPath}', err);
             }
         });
     }
@@ -87,12 +86,11 @@ exports.compareScreenshots = compareScreenshots;
  */
 function onAfterScreenshot(details) {
     console.log('🧸 Screenshot was saved to:', details.path);
-    if (!details.path.match('cypress')) {
+    if (!details.path.match('visual')) {
         return Promise.resolve({});
     }
     const getNewPath = (path) => {
-        let newPath = path
-            .slice(path.lastIndexOf('___') + 3);
+        let newPath = path.slice(path.lastIndexOf('___') + 3);
         console.log(newPath);
         if (newPath.startsWith('/')) {
             newPath = `.${newPath}`;
@@ -103,13 +101,12 @@ function onAfterScreenshot(details) {
     const newPathDir = newPath.substring(0, newPath.lastIndexOf('/'));
     try {
         fs.mkdirSync(newPathDir, { recursive: true });
-        console.log('🧸 No screenshot folder found in the package. Created new screenshot folder:', newPathDir);
     }
     catch (err) {
         console.error('❌ Error creating new screenshot folder:', newPathDir, err);
     }
     return new Promise((resolve, reject) => {
-        fs.rename(details.path, newPath, (err) => {
+        fs.rename(details.path, newPath, err => {
             if (err) {
                 reject(err);
             }

package/package.json

@@ -29,5 +29,5 @@
     "build": "tsc",
     "postbuild": "echo \"require('./dist/match-screenshot');\" > commands.js"
   },
-  "version": "0.0.10"
+  "version": "0.0.12"
 }