Hide displacement diffs tool

The Hide displacement diffs tool in the Step editor and Test editor hides differences caused by content that has moved on the page. This is useful, for example, when content is added or removed, causing other elements on the page to shift and generating extra differences.

When a large area of the page is impacted by such a change, the page can fill with pink mismatched areas, making it difficult to spot actual content changes. By using this tool, you can hide content that has only moved and focus on mismatches caused by real content changes.

The screenshot below is an example of such a scenario. You can see that a large part of the image is shaded pink and it is difficult to see what the specific differences are.

The reason for the large amount of pink is the solid line that appears at the top of the baseline image, that is thinner in the checkpoint image. The thinner line causes all the content underneath that line in the checkpoint image, to shift upwards. When Eyes compares the two images as a unit it finds that the entire page mismatches.

After a click on the Hide displacement diffs button in the View toolbar

the display looks like this:

By hiding the displacement differences, we can now clearly see the content differences between the images.

If the content diffs are intended and the displacement is acceptable, then you can accept the step, and Eyes updates the baseline image with the checkpoint image which includes both the displacement and the content differences. Otherwise, you can annotate the incorrect area, and reject the step.

The Hide displacements diffs tool it is a toggle, whose state is step specific. By default, when you first load a batch, displacement diffs are not hidden. When you click the button while viewing a particular step, hiding displacement diffs is enabled for that step only. Eyes will recheck that step, this time not reporting mismatches that are due to content displacement. The tool remains enabled for that step as log as you remain in the batch.

You can use the SDK to enable ignore displacements during matching. Eyes will only report a checkpoint mismatch if there are actual feature differences and will ignore features that have only been displaced. Use the method ignoreDisplacements to enable this for single checkpoint. You can enable ignore displacements for an entire test or test suite by using the method configuration.ignoreDisplacements.