Add hover step to test the behavior of an element that has hover interaction. For example: a menu that opens only with a hover, a tooltip or appearance of new elements (button, explanation over images etc.).
How to add a hover state?
- Open the menu, and add a "hover" step by clicking "Add Hover Action":
Now, you'll be asked to select the element you'd like to record its hover state:
Note: If you get the message "No app to choose an element from" this means that you must first run the test so you can select a component from within your application.
Once selected, a new hover step is added.
You can also add hover using alt + h during your recording.
This will also enable you adding nested hovers, eg. hovers that depended on each other.
Adding validations to hovered element
You can add text validation using alt + v to hover elements.
Before the validation step, you need to add a hover step using one of the previously demonstrated methods.
Element visible validation:
Currently Testim doesn't fully support adding visible validations to hovered elements.
However, you can add those validations with workaround:
Change your app code so any hovered element will stay on mouse out. Then, add step validations the regular way.
Common issues you'll be able to test:
- Validate if the hovered element appears or not
- Validate the text on the hovered element