Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Branch: master
Fetching contributors…

Cannot retrieve contributors at this time

61 lines (35 sloc) 1.92 kB

ScreenTest Library Test

Tool for testing the UI by comparison screenshots.

Based on JavaScript and HTML5 Canvas.

Current version: 1.0.4

Demo

For a live demo, go to http://dev.andreychizh.com/screentest/

Documentation

1. Constructor:

var test = new ScreenTest(srcImg, testImg, etalonImg, bounds);
Params:
@param {String} srcImg     Local path to the images folder.
                           Attention! There should be a single host for html test page, folder with images 
                           and this ScreenTest library (Constraint of HTML5 security)

@param {String} testImg    Name of test screenshot image
@param {String} etalonImg  Name of etalon screenshot image

@param {Array|Null} bounds Array of coordinates top-left and right-bottom boundary points of comparison:
                           [0] - x-axis of left-top point, px
                           [1] - y-axis of left-top point, px
                           [2] - x-axis of right-bottom point, px
                           [3] - y-axis of right-bottom point, px

                           If no set - compare screenshots with no boundaries.
Example:
var test = new ScreenTest('img/test/', 'firefox_test.png', 'firefox_standart.png', [10,10,1430,890]);

2. Result:

The result is displayed in a div element with id="result" in the percentage difference images.

Example:
<div id="result">12.46</div>

3. Cleaning of the environment after the test:

Example:
test.tearDown();

Download Library

ScreenTest Library

Copyright

Copyright © Andrey Chizh, 2012

http://andreychizh.com/

Jump to Line
Something went wrong with that request. Please try again.