How to wait until an item is available for viewing in WebDriverJS?

Question

Does anyone know how to wait for WebElement to be available in WebDriverJS ? I already know how to wait for an element to be “visible”, but I need it to be “clickable”. Something similar to the expected conditions in a Python binding. I could not find something like this in the Webdriver API.

Answer 1

There seems to be no condition equivalent to Python's selenium.webdriver.support.expected_conditions.element_to_be_clickable . However, looking at the source of this condition, I see that it performs two checks:

• What element is visible.

• What is it on.

So, you can wait until both conditions become true. The following code illustrates how to do this. First, it makes the element invisible and turns it off, sets some timeouts to make it visible and turns it on, and then wait for two conditions.

 var webdriver = require('selenium-webdriver'); var driver = new webdriver.Builder(). withCapabilities(webdriver.Capabilities.chrome()). build(); driver.get('http://www.google.com'); // This script allows testing the wait. We make the element invisible // and disable it and then set timeouts to make it visible and enabled. driver.executeScript("\ var q = document.getElementsByName('q')[0];\ q.style.display = 'none';\ q.disabled = true;\ setTimeout(function () {\ q.style.display = '';\ }, 2000);\ setTimeout(function () {\ q.disabled = false;\ }, 3000);\ "); driver.findElement(webdriver.By.name('q')).then(function (element) { driver.wait(function () { return element.isDisplayed().then(function (displayed) { if (!displayed) return false; return element.isEnabled(); }); }); element.sendKeys('webdriver'); }); driver.findElement(webdriver.By.name('btnG')).click(); driver.wait(function() { return driver.getTitle().then(function(title) { return title === 'webdriver - Google Search'; }); }, 1000); driver.quit(); 

The code may look a little strange due to the fact that we work with promises. Not that promises were weird in nature, but they were used to being used to working with Python.

Answer 2

If you do not want to click an object when it is available **, you can do something like this:

 function clickWhenClickable(locator, timeout){ driver.wait(function(){ return driver.findElement(locator).then(function(element){ return element.click().then(function(){ return true; }, function(err){ return false; }) }, function(err){ return false; }); }, timeout, 'Timeout waiting for ' + locator.value); ; } 

**, if you just want to check if the clickable element is accessible without clicking it , this snippet is not for you. In this case, I would say that webdriver js does not provide the means to do this. (or at least I haven't found it yet, ideas were welcome))

Answer 3

UNTIL seems closest in webdriver js for this:

Check: https://seleniumhq.imtqy.com/selenium/docs/api/javascript/module/selenium-webdriver/lib/until.html

The waiting conditions are already defined here. I do not know which one should be considered clickable.