How to Mask an Area of a Screenshot

Overview

Dynamic content in your app like an invoice number, date, or name can change every time you run a test.

If you need to take a screenshot of a UI element that contains dynamic content, you can apply a mask to the dynamic content to tell the Automation Service to ignore it. The Automation Service will ignore any masked section of the screenshot when it runs or previews a test, so the step will still pass regardless of the content behind the mask.

How it works

Add a masked area to any screenshot that uses Intelligent matching mode:
1. You can add a mask for any action that requires a screenshot (such as Click or Fill).
2. Choose "Mask..." to view a new modal where you can mask an area of the screenshot. Zoom in and out if needed.
3. When the test is run, automation will ignore the masked area of the screenshot when finding an element and when comparing it to the closest match found.

Edit an existing dynamic area:
1. You can return to the UI element modal to edit or delete a mask.
2. You can also edit the masked area when updating a screenshot via Results.

See the masked area that was ignored in results:
1. The target image and closest match on the run page show the masked area, the area ignored, in the closest target.
2. In the automation logs, you'll see that a masked area was used.

FAQs

Does this work for any action type?

Yes, you can mask a specific area for any action or assertion that includes a screenshot so long as you use Intelligent matching mode.

Can I use masking with any image matching mode?

No, masking is not an option with Strict or Legacy modes. If you are using Strict or Legacy modes, you can change the matching mode when editing the step.

Can I interact with the masked area?

Yes, you can move the element crosshairs to click, fill, drag, etc a location within the masked area (e.g. you need to click today's date which always appears in the same area of the page, but changes daily).

Can I add multiple masked areas to a single step?

No, each step can only have one masked area. If you have multiple areas you want to verify and mask, then it'd be best to create multiple Observe actions.

If you have any questions, reach out to us at [email protected].