Visual change detection overview

An overview of visual change detection in mabl

Visual and functional testing complement each other to help you take a more holistic approach to testing the user interface (UI) of your application. While functional testing ensures there are no issues with app behavior, visual testing ensures that there are no issues with the overall look and feel.

In mabl, there are two types of visual change detection capabilities:

  • Visual change detection for browser tests
  • Standalone visual smoke tests

Visual change detection for browser tests

Visual change detection works for all browser tests that run as part of a plan. Mabl identifies visual changes in browser tests by comparing screenshots from the current test run to a visual baseline.

If mabl identifies a visual change, the test step appears with a "visual change" label and the screenshot includes a comparison to the visual baseline.


Detecting visual change in a browser test

You can configure visual change detection to create a dynamic visual model and generate visual change insights. And if your app gets updated, you can update the visual model through a process called visual model rebaselining.

Visual smoke tests

A visual smoke test is a standalone test that visits a list of URLS and checks each page for visual changes, broken links, and JavaScript errors.


Reviewing a page in visual smoke test output

You can run visual smoke tests to monitor key pages in your application across all supported browsers, get visual change insights, and review the test output for visual regressions.


Visual changes do not fail tests

When mabl detects a visual change, whether it is a visual change in a browser test or a visual change in a visual smoke test, it treats the visual change as a warning that does not cause the test run to fail.