Visual tests check important pages in your application for correct loading, visual changes, broken links, JavaScript errors, and network activity issues across browsers.
Test output page for a visual test
This guide highlights some use cases and a sample workflow for visual tests.
For more information on visual change detection in browser tests, see the article on visual change learning.
Use cases
Visual tests can be used to complement an existing testing strategy in the following ways:
Validate key pages
The visual test is great for continuous testing across your staging and production environments to validate that key pages from your application have a consistent appearance and are loading as expected.
If a visual change is detected, mabl generates a visual change insight.
Configuring notifications for visual change insights
You can configure the mabl integrations for both Slack and Microsoft Teams to send notifications for visual change insights.
Test across browsers
Visual tests can detect visual changes on all browsers supported by mabl.
Create targeted checks
Visual tests only check for broken links on the URLs that you specify. They do not crawl your entire application.
Flag visual regressions
When you step through visual changes in a test run, you can use the review actions to accept, dismiss, or flag the new version as a visual regression.
Your workflow
Here is a sample workflow for visual tests:
- Identify key pages for your web app and site based on your analytics
- Create a visual test from the mabl app for those page URLs
- Run the test as part of a plan. If the test output includes visual changes, mabl generates visual change insights.
- Review results of tests that have visual changes. If there are unexpected visual changes, follow up with your team to address issues with the app or accept the visual changes as expected.