looks-same - npm Package Compare versions

Comparing version 3.3.0 to 4.0.0

benchmark/diff.js

@@ -9,6 +9,6 @@ 'use strict';
 function imagePath(image) {
-    return path.resolve(__dirname, '..',  'test', 'data', 'src', image);
+    return path.resolve(__dirname, '..', 'test', 'data', 'src', image);
 }
 
-function benchamrkDiff(title, refImage, currImage) {
+function benchmarkDiff(title, refImage, currImage) {
     suite(title, function() {
@@ -43,3 +43,3 @@ var path1 = temp.path({suffix: '.png'}),
 
-benchamrkDiff('small diff',
+benchmarkDiff('small diff',
     imagePath('ref.png'),
@@ -49,5 +49,5 @@ imagePath('different.png')
 
-benchamrkDiff('large diff',
+benchmarkDiff('large diff',
     imagePath('large-ref.png'),
     imagePath('large-different.png')
 );

CHANGELOG.md

 # Changelog
 
+## 4.0.0 - 2018-09-11
+
+* Update nodejs to 6 version
+* Add ability to make ignore antialiasing less strict
+
 ## 3.3.0 - 2017-12-26
@@ -4,0 +9,0 @@

index.js

@@ -14,5 +14,3 @@ 'use strict';
 
-const JND = 2.3; //Just noticable difference
-                //if ciede2000 >= JND then colors
-                //difference is noticable by human eye
+const JND = 2.3; // Just noticeable difference if ciede2000 >= JND then colors difference is noticeable by human eye
 
@@ -40,18 +38,4 @@ const getDiffArea = (diffPixelsCoords) => {
 
-const createComparator = (png1, png2, opts) => {
-    let comparator = opts.strict ? areColorsSame : makeCIEDE2000Comparator(opts.tolerance);
-
-    if (opts.ignoreAntialiasing) {
-        comparator = makeAntialiasingComparator(comparator, png1, png2);
-    }
-
-    if (opts.ignoreCaret) {
-        comparator = makeNoCaretColorComparator(comparator, opts.pixelRatio);
-    }
-
-    return comparator;
-};
-
-const makeAntialiasingComparator = (comparator, png1, png2) => {
-    const antialiasingComparator = new AntialiasingComparator(comparator, png1, png2);
+const makeAntialiasingComparator = (comparator, png1, png2, opts) => {
+    const antialiasingComparator = new AntialiasingComparator(comparator, png1, png2, opts);
     return (data) => antialiasingComparator.compare(data);
@@ -78,2 +62,16 @@ };
 
+const createComparator = (png1, png2, opts) => {
+    let comparator = opts.strict ? areColorsSame : makeCIEDE2000Comparator(opts.tolerance);
+
+    if (opts.ignoreAntialiasing) {
+        comparator = makeAntialiasingComparator(comparator, png1, png2, opts);
+    }
+
+    if (opts.ignoreCaret) {
+        comparator = makeNoCaretColorComparator(comparator, opts.pixelRatio);
+    }
+
+    return comparator;
+};
+
 const iterateRect = (width, height, callback, endCallback) => {
@@ -149,5 +147,6 @@ const processRow = (y) => {
 
-    if (opts.ignoreAntialiasing === undefined) {
-        opts.ignoreAntialiasing = true;
-    }
+    _.defaults(opts, {
+        ignoreAntialiasing: true,
+        antialiasingTolerance: 0
+    });
 };
@@ -154,0 +153,0 @@

lib/antialiasing-comparator.js

@@ -8,7 +8,10 @@ 'use strict';
 
+const DEFAULT_BRIGHTNESS_TOLERANCE = 0;
+
 module.exports = class AntialiasingComparator {
-    constructor(baseComparator, png1, png2) {
+    constructor(baseComparator, png1, png2, {antialiasingTolerance}) {
         this._baseComparator = baseComparator;
         this._img1 = png1;
         this._img2 = png2;
+        this._brightnessTolerance = antialiasingTolerance; // used only when comparing the darkest and the brightest pixels
     }
@@ -33,2 +36,6 @@
         const y2 = Math.min(y1 + 1, height - 1);
+
+        const checkExtremePixels = !img2;
+        const brightnessTolerance = checkExtremePixels ? this._brightnessTolerance : DEFAULT_BRIGHTNESS_TOLERANCE;
+
         let zeroes = 0;
@@ -43,3 +50,5 @@ let positives = 0;
             for (let x = x0; x <= x2; x++) {
-                if (x === x1 && y === y1) continue;
+                if (x === x1 && y === y1) {
+                    continue;
+                }
 
@@ -50,5 +59,9 @@ // brightness delta between the center pixel and adjacent one
                 // count the number of equal, darker and brighter adjacent pixels
-                if (delta === 0) zeroes++;
-                else if (delta < 0) negatives++;
-                else if (delta > 0) positives++;
+                if (Math.abs(delta) <= brightnessTolerance) {
+                    zeroes++;
+                } else if (delta > brightnessTolerance) {
+                    positives++;
+                } else {
+                    negatives++;
+                }
 
@@ -60,3 +73,5 @@ // if found more than 2 equal siblings, it's definitely not anti-aliasing
 
-                if (!img2) continue;
+                if (checkExtremePixels) {
+                    continue;
+                }
 
@@ -78,3 +93,5 @@ // remember the darkest pixel
 
-        if (!img2) return true;
+        if (checkExtremePixels) {
+            return true;
+        }
 
@@ -89,12 +106,14 @@ // if there are no both darker and brighter pixels among siblings, it's not anti-aliasing
         return (!this._isAntialiased(img1, minX, minY, data) && !this._isAntialiased(img2, minX, minY, data)) ||
-               (!this._isAntialiased(img1, maxX, maxY, data) && !this._isAntialiased(img2, maxX, maxY, data));
+            (!this._isAntialiased(img1, maxX, maxY, data) && !this._isAntialiased(img2, maxX, maxY, data));
     }
 
     _brightnessDelta(color1, color2) {
-        // gamma-corrected luminance of a color (YIQ NTSC transmission color space)
-        // see https://www.academia.edu/8200524/DIGITAL_IMAGE_PROCESSING_Digital_Image_Processing_PIKS_Inside_Third_Edition
-        const rgb2y = (r, g, b) => r * 0.29889531 + g * 0.58662247 + b * 0.11448223;
-
         return rgb2y(color1.R, color1.G, color1.B) - rgb2y(color2.R, color2.G, color2.B);
     }
 };
+
+// gamma-corrected luminance of a color (YIQ NTSC transmission color space)
+// see https://www.academia.edu/8200524/DIGITAL_IMAGE_PROCESSING_Digital_Image_Processing_PIKS_Inside_Third_Edition
+function rgb2y(r, g, b) {
+    return r * 0.29889531 + g * 0.58662247 + b * 0.11448223;
+}

lib/ignore-caret-comparator/states/state.js

@@ -8,3 +8,3 @@ 'use strict';
 
-    validate(point) {
+    validate() {
         throw new Error('Not implemented');
@@ -11,0 +11,0 @@ }

lib/png.js

@@ -106,3 +106,3 @@ 'use strict';
             ? callback(error, null)
-            : exports.fromBuffer(data, callback)
+            : exports.fromBuffer(data, callback);
     });
@@ -109,0 +109,0 @@ };

package.json

 {
   "name": "looks-same",
-  "version": "3.3.0",
+  "version": "4.0.0",
   "description": "Pure node.js library for comparing PNG-images, taking into account human color perception.",
@@ -10,23 +10,27 @@ "main": "index.js",
   "dependencies": {
-    "color-diff": "^0.1.5",
-    "concat-stream": "^1.5.0",
+    "color-diff": "^1.1.0",
+    "concat-stream": "^1.6.2",
     "lodash": "^4.17.3",
     "parse-color": "^1.0.0",
-    "pngjs": "^3.0.1"
+    "pngjs": "^3.3.3"
   },
   "devDependencies": {
-    "chai": "^1.9.1",
-    "gm": "^1.16.0",
-    "matcha": "^0.5.0",
-    "mocha": "^1.21.4",
+    "chai": "^4.1.2",
+    "eslint": "^5.3.0",
+    "eslint-config-gemini-testing": "^2.8.0",
+    "gm": "^1.23.1",
+    "matcha": "^0.7.0",
+    "mocha": "^5.2.0",
     "proxyquire": "^1.7.10",
-    "sinon": "^1.17.6",
-    "temp": "^0.8.1"
+    "sinon": "^6.1.5",
+    "temp": "^0.8.3"
   },
   "scripts": {
-    "test": "mocha",
+    "test-unit": "mocha",
+    "lint": "eslint .",
+    "test": "npm run test-unit && npm run lint",
     "bench": "matcha benchmark/*"
   },
   "engines": {
-    "node": ">= 4.0"
+    "node": ">= 6.0.0"
   },
@@ -33,0 +37,0 @@ "author": "Sergey Tatarintsev <[e-mail]> (https://github.com/SevInf)",

README.md

@@ -45,2 +45,14 @@ # LooksSame
 
+Some devices can have different proportion between physical and logical screen resolutions also
+known as `pixel ratio`. Default value for this proportion is 1.
+This param also affects the comparison result, so it can be set manually with `pixelRatio` option.
+
+```javascript
+looksSame('image1.png', 'image2.png', {pixelRatio: 2}, function(error, equal) {
+    ...
+});
+```
+
+### Comparing images with ignoring caret
+
 For visual regression tasks it may be useful to ignore text caret in text input elements.
@@ -57,8 +69,8 @@ You can do it with `ignoreCaret` option.
 
-Some devices can have different proportion between physical and logical screen resolutions also
-known as `pixel ratio`. Default value for this proportion is 1.
-This param also affects the comparison result, so it can be set manually with `pixelRatio` option.
+### Comparing images with ignoring antialiasing
 
+Some images has difference while comparing because of antialiasing. These diffs will be ignored by default. You can use `ignoreAntialiasing` option with `false` value to disable ignoring such diffs. In that way antialiased pixels will be marked as diffs. Read more about [anti-aliasing algorithm](http://www.eejournal.ktu.lt/index.php/elt/article/view/10058/5000).
+
 ```javascript
-looksSame('image1.png', 'image2.png', {pixelRatio: 2}, function(error, equal) {
+looksSame('image1.png', 'image2.png', {ignoreAntialiasing: true}, function(error, equal) {
     ...
@@ -68,6 +80,9 @@ });
 
-Some images has difference while comparing because of antialiasing. These diffs will be ignored by default. You can use `ignoreAntialiasing` option with `false` value to disable ignoring such diffs. In that way antialiased pixels will be marked as diffs. Read more about [anti-aliasing algorithm](http://www.eejournal.ktu.lt/index.php/elt/article/view/10058/5000).
+Sometimes the antialiasing algorithm can work incorrectly due to some features of the browser rendering engine. Use the option `antialiasingTolerance` to make the algorithm less strict. With this option you can specify the minimum difference in brightness (zero by default) between the darkest/lightest pixel (which is adjacent to the antialiasing pixel) and theirs adjacent pixels.
 
+We recommend that you don't increase this value above 10. If you need to increase more than 10 then this is definitely not antialiasing.
+
+Example:
 ```javascript
-looksSame('image1.png', 'image2.png', {ignoreAntialiasing: true}, function(error, equal) {
+looksSame('image1.png', 'image2.png', {ignoreAntialiasing: true, antialiasingTolerance: 3}, function(error, equal) {
     ...
@@ -74,0 +89,0 @@ });

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

29955

increased by5.61%

Lines of code

641

increased by2.4%

Number of lines in readme file

128

increased by13.27%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

9

increased by28.57%

Dependency changes

• + Addedcolor-diff@1.4.0(transitive)

• - Removedcolor-diff@0.1.7(transitive)

• Updatedcolor-diff@^1.1.0

• Updatedconcat-stream@^1.6.2

• Updatedpngjs@^3.3.3