Unable to select option from autocomplete list without hovering

Hi, Im trying to record a test script in the Katalon Recorder, and I am encountering an issue.

In my application, there is a field where I type the first 3,4 characters and an autocomplete list of users is generated. If I hover over the desired option, the element id displayed is id=“ui-active-menuitem”. The options displayed in the list do not seem to have an element id defined, because of which, when I run the script, it is unable to locate which option to click and fails.
The script only runs successfully when I hover on the option I want to be selected.

Really? That’s terrible. Are you certain it’s the id that changes, not the class or other attribute?

What HTML/JS framework is the AUT using? Is it a well-known publicly available framework?

If it’s something developed in-house, let them know that THIS tester thinks it’s a terrible design.

Seriously!

And by the way, I’m moving your post (since it’s not a bug report).

Hi @amrahkhalid

That is indeed not a good web page for testing. If the key here is to hover, then you may try the following solution to see if you can automate the hover.

In Katalon Studio you can execute a Javascript code by:

https://docs.katalon.com/katalon-studio/docs/webui-execute-javascript.html

The general heuristic is to find a way to use Javascript to trigger the onmouseover event handler of an object ( this is equivalent to hovering it). If this is not possible then there’s nothing else that can be done I`m afraid.

Regards !

I found this old article describing a similar problem

I then recreated the solution in Katalon Recorder like this:

open | https://jqueryui.com/autocomplete/ | |
selectFrame | index=0 | |
click | id=tags | |
type | id=tags | ja |
waitForTextPresent | JavaScript | |
mouseOver | //li[. = "JavaScript"] | |
click | //li[. = "JavaScript"] | |
assertValue | id=tags | JavaScript |

Note that it took me a while to work out the XPath for the mouseOver and click commands
On an internal system, I also successfully used the XPath:

//html/body/ul/li/a[. = "Art"]

Also note that the text to look for is case-sensitive, an XPath with the text “Javascript” fails.

1 Like