nightwatchcss
nightwatchcss copied to clipboard
How to compare 2 images?
I have a set of images extracted from the layout pdf and I would like to compare it with the screenshot taken from the site. How can I compare them?
// init WebdriverJS
var client = require('webdriverjs');
var nightwatchcss = require('nightwatchcss');
module.exports = {
"Init nightwatchcss": function (browser) {
nightwatchcss.init(browser, {
screenshotRoot: 'screenshot',
failedComparisonsRoot: 'diffs',
misMatchTolerance: 0.05,
screenWidth: [1200]
});
},
"I am a basic test": function (browser) {
browser
.url("https://example.com")
.waitForElementVisible('body', 15000)
.resizeWindow(1200, 800)
.execute(function () {
moveNext(1);
})
.pause(5000)
.saveScreenshot('./screenshot/test-1-build.png')
.execute(function () {
moveNext(2);
})
.pause(5000)
.waitForElementVisible('body', 15000)
.saveScreenshot('./screenshot/test-2-build.png')
.webdrivercss('homepage', {
elem: 'body',
screenWidth: [1200]
}, function (err, res) {
assert.equal(err, null);
// this will break the test if screenshot differ more then 0% from
// the previous taken image
assert.equal(res.misMatchPercentage < 0, true);
})
.end();
}
};