Skip to content
master
Go to file
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
 
 
 
 
 
 
 
 
 
 
 
 
 
 

readme.md

image-equal unstable Build Status

Test if two images are equal. Useful for organising baseline tests for visual components.

Usage

npm install image-equal

let t = require('tape')
let equal = require('image-equal')
let pixels = require('image-pixels')

t('image test', async t => {
	t.ok(equal(await pixels('./a.png'), canvasA))
	t.ok(equal(await pixels('./b.png'), canvasB, {threshold: .2}))

	// display diff to console in case of mismatch
	t.ok(equal(await pixels('./c.png'), canvasC, true))

	// compare two pixel arrays
	t.ok(equal([0,0,0,255,255,255,255,255], [0,0,0,255,255,255,255,255]))

	t.end()
})

equal(imageA, imageB, diff?, threshold=0.1|options?)

Takes two images and returns true if they're similar and false otherwise, optionally sending diff stats to diff output. options can adjust comparison logic.

imageA, imageB

Shoud be actual image data container, one of:

  • Canvas, Context2D, WebGLContext
  • ImageData or Object {data: Uint8Array, width, height}
  • DataURL or base64 string
  • Image, Video, ImageBitmap with resolved data
  • Array, Array of Arrays, Uint8Array, FloatArray with raw pixels
  • ArrayBuffer, Buffer
  • Ndarray

To use async image source, like URL, path, ImageBitmap, Promise, incomplete Image/Video, Stream, Blob and alike, use image-pixels:

const equal = require('image-equal')
const load = require('image-pixels')
equal(await load('./a.png'), await load('./b.png')),

diff

Can be one of:

Type Meaning
Bool Show diff data to console, by default false.
console Send diff data to console, same as true.
Canvas2D, Context2D Put diff pixels to a canvas.
document, Element Create a canvas in document/element with diff pixels.
filename String Write diff data to a file or filepath. In browser downloads the file.
ImageData Write diff data to ImageData object.
Array, TypedArray Write diff pixels data to target array.
Stream Send data to stream, eg. process.stdout (acts the same as console).
Function Call function with diff data object.
Object Put diff stats into object: diff.data for diff pixels, diff.count for number of diff pixels, diff.ids for diff pixel ids and diff.amount for amount of difference between images, 0..1.

options

Property Meaning
antialias Include antialias, by default false.
threshold Sensitivity to px difference, 0 - intolerant, 1 - not sensitive. By default 0.1.
clip A sub-area to compare, rectangle [left, top, width, height].

See also

Credits

© 2018 Dmitry Yv. MIT License

About

Test if two images are equal

Resources

Releases

No releases published

Packages

No packages published
You can’t perform that action at this time.