@mikhail-g/node-resemble-js
Analyse and compare images with Javascript. This project does not need canvas or any other binary dependencies. It is a modification of Resemble.js
Installation
npm install @mikhail-g/node-resemble-js
Example
Retrieve basic analysis on image
const resemble = require('@mikhail-g/node-resemble-js');
resemble(fileData)
.onComplete(function(data){
console.log(data);
});output for a blank white image:
{
red: 255,
green: 255,
blue: 255,
brightness: 255
}Use resemble to compare two images
var diff = resemble(file)
.compareTo(file2)
.ignoreColors()
.onComplete(function(data){
console.log(data);
});output:
{
misMatchPercentage : 100, // %, when all pixels are different in 2 images
isSameDimensions: false, // is width and height of 2 images are the same
dimensionDifference: { width: 0, height: -1 }, // defined if dimensions are not the same
getImageDataUrl: function(){}
}Configuration
You can change the comparison method after the first analysis or before onComplete().
diff.ignoreNothing(); // any change in pixel color or brightness will increase misMatchPercentage
diff.ignoreColors(); // compares only brightness of pixels ignoring colors
diff.ignoreAntialiasing(); And change the output display style.
resemble.outputSettings({
errorColor: {
red: 255,
green: 0,
blue: 255
},
errorType: 'movement',
transparency: 0.3
});
// resembleControl.repaint();Usuage in cucumber step definition
this.Then(/^Screenshot should match image "(.*)"$/, function (image, callback) {
browser.takeScreenshot().then(function(pngString) {
var screenshot = new Buffer(pngString, 'base64');
resemble(image)
.compareTo(screenshot)
.onComplete(function(data){
if (Number(data.misMatchPercentage) <= 0.01) {
callback();
} else {
data.getDiffImage().pack().pipe(fs.createWriteStream(image + 'diff.png'));
callback.fail(new Error("Screenshot '" + image+ "' differ " + data.misMatchPercentage + "%"));
}
});
});
})Credits
- Created by James Cryer and the Huddle development team.
- Lukas Svoboda - modification for node.js
- Mirza Zeyrek - jpeg support
- LarryG - dependency updates
- Mykhailo Hariachyi - fix for ignoreNothing() function