When testing an application, there are times when you may need to assert that an element is absent from the page. For example, after logging out, you might want to validate that a logged-in user profile is no longer present in the nav bar. Or after a delete action, you may want to confirm that the deleted item is no longer on the page.
Depending on what you’re trying to validate, there are several ways to assert that an element is not present in the mabl Trainer:
Hidden elements
An “is not present” assertion checks whether the element exists in the DOM—not whether it’s visible on screen.
If the target element is present in the HTML but is hidden using an attribute like display, visibility, or opacity, an “is not present” assertion will fail. For browser tests, you can use a CSS assertion to check the element’s visibility properties instead.
Record steps out of order
If you can access the element that should be absent using different credentials, on a different page, or before a delete action, try recording the assertion while the element is visible and then reposition it in your test.
See an example of this strategy in the following animation:
Working backwards to create an “is not present” assertion
For example, to validate that an “Admin settings” element is absent for a restricted user role, you could try the following:
- Pause recording and log in as a user that can see the “Admin settings” element.
- With recording on create an “is not present” assertion step on that element. Note that the assertion will run and fail immediately while the element is present.
- Move that assertion step to the part of the test where the restricted user is logged in.
When the test runs as the restricted user, the assertion should pass because the “Admin settings” element won’t be present.
Use Configure Find
For best results, add Configure Find to the “is not present” assertion:
- Select element attributes that are unlikely to change.
- Make sure that auto-heal is disabled. If an “is not present” assertion auto-heals to a different element that matches the Configure Find settings, the assertion will fail.
Use custom find
If you can’t make the element appear during testing, but you know its CSS or XPath, you can record a custom find assertion:
- Add a custom find step: + (Add step) > Find elements.
- Select a Find type:
- “First element” - to assert that the target element is absent - OR -
- “Number of elements” - to assert that there are no elements matching the CSS or XPath
- Enter the CSS or XPath and select “Make assertion”.
- On the next page, configure assertion details
- “First element” - configure an HTML assertion and set the assertion type to “is not present”
- “Number of elements” - set the expected value to 0.
Asserting on the count of elements is also useful when you want to assert on the number of elements before and after a change. For example, if you delete a record from a table, you can use a custom find assertion on the count of elements before and after the change to assert that the table shows one less record.
Limitations
- Custom find assertions are not available for mobile tests.
- If the target element is inside a shadow DOM, use a CSS query instead of XPath. See testing in the shadow DOM for more details.
Wait until an element becomes absent
If your test case requires waiting until an element is absent from the page, use a Wait until not present step. It pauses the test until a matching element leaves the DOM, up to a timeout you set. See adding wait steps for the walkthrough.
If the test has to keep doing something to make an element go away, such as clicking a "Load more" button or dismissing rows one at a time, use a while loop with a condition on that element instead.