eValid -- Automated Web Quality Solution
Browser-Based, Client-Side, Functional Testing & Validation,
Load & Performance Tuning, Page Timing, Website Analysis,
and Rich Internet Application Monitoring.
eValid -- Comparing Images During Test Playback
This page explains how the CompareImages command validates that
a saved [baseline] images matches a current image contents.
For example, a recording is created on a webpage where eValid's SaveWindow script command is applied:
- Step 1: During recording, perform/request a "SaveWindow" action...
- Step 2: This action generates a Script File entry which looks like this...
- Step 3: During playback, eValid generates a separate (..-R..) Response Image
file in your current working folder...
- Step 4: Choose a baseline image file to perform the comparison with
and manually edit in the "CompareImages" script command into your *.evs (test script) file...
- Step 5: Here are the results in the Event Log
of playing back the above *.evs script file if there is NO difference found...
- Step 6: Here are the Event Log results from playing back
the above evs script file if there IS a difference found...
- Step 7: To confirm whether the images are different or not,
you can use eValid's "Tools -> eV-ImageDiff" utility to display the differences...
- Step 8: When you are asked,
please provide the comparison Baseline Image name and Response Image name...
- Step 9: Once your comparison images
are loaded perform the difference operation by clicking on "Do Diff"...
- Step 10: If there are NO differences you see WHITE,
else an overlay of the image differences.
If two images are of dissimilar size, you see the outline of the larger, and
the matchup is from the upper left hand corner of each one.
CAUTION: WHITE on the screen is what you may see for "no differences"
but that may NOT always imply that the two pixels at each pixel position are identical.
Very small differences may not be visible (big differences usually are).
- Step 11: Sample "savewin0.evs" Script
eValid creates the following recorded script based upon the above actions:
# Recording by eValid(TM) V9
# Copyright © 2010 by Software Research, Inc.
# Recording made on: Microsoft Windows 2000 (IE 6.0), HostName ""
ScreenSize 1280 1024
SaveWindow 0 "win1"
# Here is the comparison...
CompareImages "basewin1.bmp" "savewin-R.win1.bmp"
# Recording stopped.
- Additional Notes
You may see screens that "compare unequal" but appear equal visually
for many reasons, among them:
- One window is in focus and the other is not in
focus. The color of the frame will be different,
depending on whether the window is/isn't in focus,
so that could account for what you are seeing.
Remember also that "focus" takes a few seconds to
achieve, and eValid -- being quicker than the
eye -- can have snapped a window not in the same
focus state as what you see.
- If you have the mouse pointer in a place on the
window that is being snapped right now -- but in
a different place when you made the baseline -- that
could account for the difference.
- Maybe there is a leftover from a mouseover action
in the current window that has disappeared (to you
visually) after the actual image was shot.
second image in Step 10 of that page.
The "Record" you see in the picture is the residue of hovering over
the eValid Record button.