I recorded an action on an element that appears when hovering, but the test fails.
  • 31 Aug 2022
  • 1 Minute to read
  • Contributors
  • Dark
    Light

I recorded an action on an element that appears when hovering, but the test fails.

  • Dark
    Light

Many sites have elements such as drop-down menus and buttons that appear when the user hovers the mouseover a particular element on the page.

In many cases, elements that appear and disappear in response to the user's mouseover action are newly generated when the mouseover happens or are not visible/cannot be interacted with until the mouseover is performed.

In these cases, simply recording a click step or an assertion, for example, may result in the following during test execution.

  • An incorrect element responds, resulting in a [Review Needed] status.
  • Errors such as "Element not found" or "Element is not interactive" occur.

You can avoid this issue by adding a "mouseover to make the target element appear" step ("hover step") before the click step or assertion step against the target element.

For more information on how to record a mouseover, please see the reference article linked below.

Example scenario

We will take Autify's home page (as of July 2022) as an example.

The intended behavior in the following scenario is to click the "Help Center" link. This link appears when the user hovers over "Related Documents" in the menu at the top of the screen.

Successful Example

Scenario:

(Mouseover is performed before clicking the target element.)
Record_mouse_over_fail_1.png

Test Result:

(The correct area was clicked.)
Record_mouse_over_fail_2.png

Failed Example

Scenario:

(Mouseover is not recorded before the "Click element" step)

Record_mouse_over_fail_3.png

Test Result:

(It reacted to a similar element elsewhere on the screen. As a result, the step is marked as [Review needed].)

Record_mouse_over_fail_4.png

References

If the above solution does not work, please get in touch via chat.


Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.