How to Reduce Screenshot Size

Introduction

One of the key features of Testplane is the ability to test layouts using screenshots. For this, you can take a screenshot during different states of a web page in your tests and compare it with a reference.

An example of such a comparison:

For Beginners

Where do reference screenshots come from?

You wrote a test using the Testplane assertView command. The assertView command compares the actual screenshot with the reference screenshot. An actual screenshot is one that the test takes during its run. It reflects the current state of your web page. On the first run of your test, you don't yet have a reference screenshot. Therefore, the assertView command will fail with a message that the reference screenshot is not found. At the same time, you will have an actual screenshot. If the actual screenshot reflects the state of your web page you expect (consider as reference), then you need to accept the actual screenshot as the reference one. To do this, you need to run Testplane with an additional --update-refs option. Alternatively, you can use the GUI mode provided by the html-reporter plugin. With it, you can view the run report in GUI mode, ensure the actual screenshots are as you expect, and accept them using the Accept button.

Problem

If your project has many tests that use layout validation via screenshots, then your project will have many screenshots. Sometimes these screenshots are quite large and can take up a lot of space on the file system.

If the project is actively developed, each pull request will generate its own test run report, containing hundreds (or thousands) of reference screenshots. The larger the screenshots, the larger your reports will be. This means they will take longer to download, occupy more disk space, and so on.

Solution: testplane-image-minifier

To reduce the space screenshots occupy on disk, add the testplane-image-minifier plugin to your project. This plugin supports 8 levels of lossless image compression.

How to add and configure the plugin is detailed in the plugin documentation.

Keywords

• testplane-image-minifier