Here is a simple code snippet that waits for a dropdown list to be displayed on the page:
var By = this.webdriver.By;
var driver = this.driver;
var bySelector = By.xpath('//*[@id="searchForm"]//*[@class="autocomplete-suggestions autocomplete-suggestion-withgroup"]');
return driver.wait(() => {
driver.isElementPresent(bySelector);
}, 6000)
.then((bool) => {
assert.isTrue(bool);
});
Unfortunately, when running this code, I receive an error message:
Error: Wait timed out after 6011msThe element in question has the following properties: https://i.sstatic.net/gK1ui.png
When clicking on the search field, the style property display: of this element changes from none to block. I am unable to see anything in the parent elements, which suggests that the element is invisible. I am unsure of what mistake I may have made.
I need to click on an item in this dropdown list and currently can only do so after using this.driver.sleep(some ms). However, I know that this is not good practice and would like to understand where I went wrong when using the wait method and how to correct it. Thank you.