Factors Affecting Image Comparison

Applies to TestComplete 14.30, last modified on November 21, 2019

Pixel-by-pixel image comparison performed by TestComplete is considered successful only if the compared image and the baseline image are absolutely identical. Otherwise, if the images contain different pixels, the comparison is considered failed. Sometimes, comparison may fail even if the content of the compared images seem to be identical and when you do not expect this failure. This topic provides information on various factors that may cause image comparison failures and explains how you can improve the quality of image comparison. For additional information on the most probable reasons of image comparison failures, see also Why Image Comparison Fails.

Below are the factors that affect the comparison procedure and may cause image comparison failures:

Aero Theme

The Aero theme of the Windows user interface widely uses translucency, image overlaying and some other visual effects that hamper the comparison process.

The images below illustrate the described situation. To show the difference between the compared images, use the Picture.Difference method. It paints identical pixels with the white color, dissimilar pixels with red, and excess pixels with fuchsia.

Image1 Image2 Image Difference

An application on a green background.

An application on a blue background.

 

There are several ways to avoid problems during comparison under these operating systems:

  • Temporally disable the Desktop Window Manager (DWM) component while capturing a screenshot. This will turn the visual effects off.

    You can use the Disable DWM before capturing image project option to toggle DWM automatically. Note that this option does not affect images captured by the Test Visualizer subsystem. Test Visualizer always captures window images as they are.

  • Save the baseline image including the alpha channel. Thus, the comparison will be performed taking into account the transparency level of each pixel.

  • Create a comparison mask that denotes which areas should be compared and pass it via the Mask parameter.

  • Fill the opaque areas and the upper-left pixel of the baseline image with a solid color and enable the Transparent parameter.

  • Select a UI theme other than Aero (if possible).

Read the Comparing and finding images when the Aero theme is active section of the Comparing and Finding Images - Specific Tasks topic for more information.

Rounded Window Corners in Windows XP Theme

Window headers in this theme have rounded corners, whereas the captured image has a rectangular form. As a result, a screenshot’s corners contain some parts of the underlying windows or background.

Image1 Image2 Image Difference

To ignore the described difference, you can do any of the following:

  • Capture screenshots over the same background.
  • Set the PixelTolerance parameter to 24 or more pixels.
  • Exclude the corner areas from comparison via the Transparent or Mask parameter.
OS Color Scheme and User Interface Theme

All supported Microsoft operating systems can draw their control elements using different color schemes. It is evident that if you compare the same GUI element taken in different color schemes, it will be reported as unequal.

Image1 Image2 Image Difference

A button captured in the Blue Windows XP scheme.

A button captured in the Silver Windows XP scheme.

 

To ignore color dissimilarities, you can use the ColorTolerance comparison parameter. Read the Ignoring a color difference between images section of the Comparing and Finding Images - Specific Tasks topic for more information.

Besides, user interface themes change visual appearance of windows, toolbars, buttons and other GUI elements. So, a control’s look&feel will be different in various themes, and its comparison will fail. Therefore both images should be taken in the same UI theme.

Certain UI themes cause additional difficulties during comparison (see Rounded Window Corners in Windows XP Theme and Aero Theme in Windows Vista and Later).

Font Smoothing

Font smoothing is used to enhance text appearance and draws letters using multiple colors rather than one color. However, when performing a pixel-by-pixel comparison, such text will certainly differ from its non-smoothed version. Therefore, font smoothing should be either enabled or disabled when both images are captured.

Image1 Image2 Image Difference

Font smoothing disabled.

Font smoothing enabled.

 

To ignore dissimilarities between smoothed and monocolor text, you can use the PixelTolerance comparison parameter. Read the Ignoring a slight difference between images section of the Comparing and Finding Images - Specific Tasks topic for more information.

Note that some applications may use custom smoothing algorithms, so the system’s font smoothing setting does not affect them. You may face one of the following problems:

  • Internet Explorer 10 and later render text in a way that differs from how earlier Internet Explorer versions do this. For example, the recent versions always use font smoothing and they do not have the Always use ClearType for HTML option anymore. As a result, web page screenshots captured in Internet Explorer 10 and later can differ from those captured in earlier Internet Explorer versions and in other browsers.

    If your tests fail in Internet Explorer 10 and later due to font smoothing, use the PixelTolerance comparison parameter.

  • A web browser can have installed add-ons that implement custom smoothing algorithms. If the plugin is installed on one test computer and is absent on other test computers, this can make image comparison fail. The best practice for creating automated tests is to disable all add-ons except for those that are required by the tested application. See topics of the Preparing Web Browsers section.

  • A Flash or Flex application can implement custom smoothing algorithms that improve smoothing or transform images in a certain way. This can make captured screenshots differ slightly from time to time. To make your tests ignore such dissimilarities, use the PixelTolerance parameter.
Image Size

Both images should have the same width and height. Images that have a different size are always reported as unequal. This does not concern the Picture.Find, Regions.Find and Regions.FindRegion methods, as they were designed to locate a smaller image within a bigger one.

Image1 Image2 Image Difference
Coordinates Offset

Since TestComplete compares pixel pairs having the same X, Y coordinates, it is important that the compared elements be exactly at the same position. Mismatching elements are reported as unequal.

Image1 Image2 Image Difference

To locate one image within another, you can use the Picture.Find, Regions.Find or Regions.FindRegion method. Read the Finding an Image Within Another Image topic for details and examples.

Screen Resolution

Screen resolution affects comparison if the element’s geometry depends on screen dimensions (for example, an application’s main window in fullscreen mode, or a panel that always occupies one third of the screen). In this case, different screen resolution causes different geometrical dimensions of the images.

Tip: Virtual machines and remote computers have their own screen resolution settings. You need to check them before playing back your tests, since it can affect image comparison. For more information on virtual machine specifics, see below.

If the compared graphical element has fixed dimensions, that is, it has the same width and height in any screen resolution, then such elements can be captured and compared regardless of the chosen resolution.

DPI Setting

The dots per inch (DPI) setting determines the size of objects and text displayed on your screen. Thus, the compared images must be captured at the same DPI value. The default value of the Windows DPI setting is 96 dots per inch.

Image1 Image2 Image Difference

Dialog fragment at 96 DPI.

Dialog fragment at 120 DPI.

 

Color Depth

This parameter indicates a range of distinct colors in an image’s palette. Images with a greater color depth represent colors more precisely.

It is recommended that both images have the same color depth. If the compared images have a different color depth, TestComplete converts the compared bitmap that has a greater color depth to the color depth of the other bitmap. Such conversion makes the images comparable, though the comparison itself becomes less accurate.

Image1 Image2 Image Difference

16-bit color image.

32-bit color image.

 

Tip: Before playing back tests on a virtual machine or remote computer, check its Color Depth setting. If it differs from the color depth of the real computer where the screenshots were captured, your comparison may fail. For more information, see below.

To ignore color depth dissimilarities, you can use the ColorTolerance and PixelTolerance comparison parameters. Read the Ignoring a color difference between images section of the Comparing and Finding Images - Specific Tasks topic for more information.

Image Format

TestComplete can work with images of the BMP, JPEG, PNG, TIFF, GIF and ICO formats. Before comparison, all the images are converted to the BMP format, since the engine can work with bitmaps only. However, as a rule, backward conversion of a compressed image format (JPEG, PNG, TIFF, GIF or ICO) does not restore the original bitmap. Thus, the identical images having different initial formats, will most likely be reported as being unequal.

The comparison of images saved in JPG leads to an inaccuracy in comparison results. The JPG format uses low compression methods which may cause similar-looking pixels to have a different color and opacity ratio. Also, similar JPG images with different compression levels will be recognized as not identical due to the features of the JPG format. Use other formats to ensure the accuracy of comparison results.
Image1 Image2 Image Difference

A PNG image.

A JPG image.

 

To ignore dissimilarities between different image formats, you can use the PixelTolerance or ColorTolerance comparison parameter.

Capture Tool

It is recommended that both images be captured by using Windows shortcuts (Alt+PrtScn or PrtScn) and then saved with Microsoft Paint, or they can be captured and saved with TestComplete. The other programs may save the captured images with slight dissimilarities.

Alpha Channel

In addition to the color for each pixel, BMP, PNG and TIFF images may also contain information that denotes pixels' transparency - the so called alpha channel. Depending on the alpha value, a pixel may range from fully transparent (0%), through semi-transparent to fully opaque (100%).

If the baseline image contains the alpha channel, the comparison is performed regarding the pixel’s transparency. Fully transparent pixels are ignored during the comparison, opaque pixels should have the same color to be reported as matching, and the colors of semi-transparent pixels should resemble one another to some degree (at that, the degree of conformity is determined by the alpha value).

TestComplete takes into account alpha channel data of the baseline image. It ignores alpha channel data of the second image. If the images have the same data in their RGB channels and they differ only by their alpha channel data, TestComplete considers these images identical.

Virtual Machines and Remote Desktops Specifics

Playing back tests on virtual machines or remote desktops can cause problems with image comparison that are not related to TestComplete. Here is a brief description of known specifics that can affect your tests:

  • When connecting to a remote computer (real or virtual), check the Display | Color Depth and Experience | Font Smoothing settings. They must fit the settings of the computer where the screenshots were captured; otherwise the image comparison may fail.

  • Virtual machines and remote computers have their own screen resolution settings. Different screen resolutions may cause different geometrical dimensions of the images. If your test depends on screen resolution, check virtual machine or remote desktop settings before you start playing it back.

  • Before playing back your tests on a virtual machine, check its color depth setting. If this setting does not coincide with the color depth settings on the computer where the screenshots were captured, your checkpoints may fail.

  • When Windows XP is accessed via Remote Desktop Connection or emulated using Windows XP Mode, its color depth is limited to 16 bit by default. If necessary, you can set the higher color depth manually for your tests to pass successfully.

  • Virtual machines use virtual video adapters instead of hardware installed on your computer. This can cause some differences that cannot be eliminated by configuring virtual machine environment. If you face such an issue, when your tests pass on a physical computer but fail on a virtual machine, set up ColorTolerance to the appropriate value (typically, the difference is about 1-5%). For more information on using the ColorTolerance parameter, see Comparing and Finding Images - Specific Tasks.

Specifics of Capturing Flash Player Screenshots
  • Adobe Flash Player implements its own smoothing algorithm that can change from version to version. If your image comparison tests have failed after installing a new version of the Flash Player plugin, update your checkpoints with the actual images or roll back to the previous Flash Player plugin version.

    Note also that custom smoothing algorithms in Flash or Flex applications can make captured screenshots differ slightly from time to time. To make your tests ignore such dissimilarities, use the PixelTolerance parameter. For more information, see Comparing and Finding Images - Specific Tasks.

  • Before playing back your tests, check Flash Player’s Quality setting. It can be set to High, Medium or Low, and it affects image comparison as well.

See Also

Region Checkpoints
About Region Checkpoints
How Image Comparison Works
Why Image Comparison Fails
Comparing and Finding Images - Specific Tasks

Highlight search results