diff --git a/package.json b/package.json index 2e8d8fa..56983a7 100644 --- a/package.json +++ b/package.json @@ -67,7 +67,7 @@ "https-proxy-agent": "^5.0.0", "jose": "^5.4.1", "jsdom": "^16.4.0", - "lcs-image-diff": "^2.0.0", + "lcs-image-diff": "^3.0.0", "node-fetch": "^2.6.6", "parse-srcset": "^1.0.2", "pngjs": "^3.4.0", diff --git a/src/compareSnapshots.js b/src/compareSnapshots.js index d795bc3..e12464f 100644 --- a/src/compareSnapshots.js +++ b/src/compareSnapshots.js @@ -1,5 +1,5 @@ import asyncRetry from 'async-retry'; -import colorDelta from 'lcs-image-diff/src/colorDelta'; +import { colorDeltaChannels } from 'lcs-image-diff/src/colorDelta'; import fetchPng from './fetchPng'; @@ -12,21 +12,21 @@ function makeAbsolute(url, endpoint) { function imageDiff({ bitmap1, bitmap2, compareThreshold }) { const len = bitmap1.width * bitmap1.height * 4; + for (let i = 0; i < len; i += 4) { - const distance = colorDelta( - [ + const distance = Math.abs( + colorDeltaChannels( bitmap1.data[i], bitmap1.data[i + 1], bitmap1.data[i + 2], bitmap1.data[i + 3], - ], - [ bitmap2.data[i], bitmap2.data[i + 1], bitmap2.data[i + 2], bitmap2.data[i + 3], - ], + ), ); + if (distance > compareThreshold) { return distance; } diff --git a/yarn.lock b/yarn.lock index a57f0fd..fcf4643 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5295,10 +5295,10 @@ lazystream@^1.0.0: dependencies: readable-stream "^2.0.5" -lcs-image-diff@^2.0.0: - version "2.1.1" - resolved "https://registry.yarnpkg.com/lcs-image-diff/-/lcs-image-diff-2.1.1.tgz#eaa88f344853500f0acbb3e1430f1339ee047ef0" - integrity sha512-pMsEXSN3GibFRxP5oH3b+3sJ6DA926XCeFLmkdxbp9QucwiAQ2nmMOaQECTP+NZ8+zo1ZIbs+Qqfa6Jm9Qtb0Q== +lcs-image-diff@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/lcs-image-diff/-/lcs-image-diff-3.0.0.tgz#9f924f534d68b3d923a02215e6a61afc75c26ee7" + integrity sha512-ZzaqR8dVbA5ISLpKBnn3gV1M8TELWg81cFuQsTutf5IRCt93vV5yRuK2ZrIgOucOQhYeB6ml6o9+pefs1QD6mw== dependencies: imagetracerjs "^1.2.5"