---
title: "Recording tooltip assertion"
slug: "recording-tooltip-assertion"
updated: 2024-03-01T02:24:42Z
published: 2024-03-01T02:24:42Z
canonical: "help.autify.com/recording-tooltip-assertion"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://help.autify.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Recording assertions on tooltips

## Tooltip Assertion

Tooltips disappear when the user hovers out of an element. When recording, you can add a tooltip assertion in one of the following ways.

          Hover step

          

Before the tooltip assertion step, you need a [hover step](/docs/hover-step) that causes the tooltip to appear.

## How to add assertions

Tooltips are typically implemented in two main ways: using only HTML and CSS, or using JS. How you add an assertion depends on how the tooltip is implemented.

## Adding an assertion to a tooltip implemented with HTML and CSS

If the tooltip is hidden using CSS and shown when hovering the parent element using HTML and CSS, select `:hover` in "Force state" in Chrome DevTools. This will keep the tooltip visible and allow you to add an assertion.

![force-state-hover](https://cdn.document360.io/a099d8a2-cfd2-42ca-9906-68b4a337f4a5/Images/Documentation/force-state-hover.png?sv=2026-02-06&spr=https&st=2026-11-11T14%3A10%3A47Z&se=2026-11-11T15%3A10%3A47Z&sr=c&sp=r&sig=VVYc6%2BaJX5Wod9wjh8BTi0XWMG21l6XpRR8EWu1TFXI%3D)

## Adding an assertion to a tooltip implemented with JS

If the tooltip is implemented using JS, you may be able to add an assertion in one of the following ways.

### Use a mouseover snippet to display the tooltip

In the DevTools console, execute the [mouse over snippet](https://javascript-snippets.autify.com/snippets/mouse/mouseover/) on the target element to display the tooltip, and then add an assertion.

### If you cannot add an assertion using the mouseover snippet

If the tooltip displays using the [mouse over snippet](https://javascript-snippets.autify.com/snippets/mouse/mouseover/), but disappears when you add the assertion, you may be able to add it by doing the following:

1. [Get a CSS selector or XPath](/docs/how-to-get-css-selectors) for the tooltip.
2. Add the desired assertion to the appropriate element and save it.
3. Set the CSS selector or XPath as the [locator](/docs/add-a-locator) of the assertion step.
4. Modify the expected value of the assertion step if necessary. For example, the expected value could be the tooltip text.

## If you are still having trouble...

Please contact us. We will work with you to resolve the issue.