Having trouble using the elementIsNotVisible method in Selenium WebDriver with JavaScript

Question

Having trouble using the elementIsNotVisible method in Selenium WebDriver with JavaScript

I'm struggling to detect the absence of an element using the elementIsNotVisible condition in the Selenium JavaScript Webdriver. This condition requires a webdriver.WebElement object, which is problematic because the element may have already disappeared from the page, leading to a NoSuchElementException. Using driver.findElement() won't work either as it returns a WebElementPromise object.

driver.wait(until.elementIsNotVisible(driver.findElement(By.css('div.bg-danger > div'))));
var element = driver.findElement(By.css('div.bg-danger > div')); // WebElement
driver.wait(until.elementIsNotVisible(element)); // not a WebElementPromise

How can I overcome this frustrating issue?

javascript selenium selenium-webdriver webdriver promise

Answer 1

Answer №1

elementIsNotVisible sets up a condition that waits for the specified element to exist in the DOM, but remain hidden from the user's view. This is useful for verifying if an element is present in the DOM without being visible.

However, relying solely on elementIsNotVisible may not always accurately determine if the element truly exists in the DOM, as it assumes the element should be in the DOM but currently not visible.

Instead of solely using driver.findElement() which returns either the element or throws a NoSuchElementException error, you can opt to handle this exception to confirm the existence of the element.

A more reliable method is to utilize driver.findElements(), which will return either a list of elements or an empty list depending on the presence of the element. You can then simply check the length of the returned list as shown below:

var elements = driver.findElements(By.css('div.bg-danger > div'));
if(elements.length == 0) {
   console.log("Element is not visible");
}

Answer 2

elementIsNotVisible sets up a condition that waits for the specified element to exist in the DOM, but remain hidden from the user's view. This is useful for verifying if an element is present in the DOM without being visible.

However, relying solely on elementIsNotVisible may not always accurately determine if the element truly exists in the DOM, as it assumes the element should be in the DOM but currently not visible.

Instead of solely using driver.findElement() which returns either the element or throws a NoSuchElementException error, you can opt to handle this exception to confirm the existence of the element.

A more reliable method is to utilize driver.findElements(), which will return either a list of elements or an empty list depending on the presence of the element. You can then simply check the length of the returned list as shown below:

var elements = driver.findElements(By.css('div.bg-danger > div'));
if(elements.length == 0) {
   console.log("Element is not visible");
}

Answer 3

Answer №2

waitForElementToDisappear(By.cssSelector("div.bg-danger > div"));

Answer 4

waitForElementToDisappear(By.cssSelector("div.bg-danger > div"));

Having trouble using the elementIsNotVisible method in Selenium WebDriver with JavaScript

Answer №1

Answer №2

Similar questions

A Step-by-Step Guide to Successfully Clicking on a Checkbox Using Selenium and Python

Executing a sudden termination of the Selenium Cucumber test run

RegEx - Finding exact matches without any additional characters trailing

Changing the counter using dual buttons in Vue.js

Execute JavaScript function only if it is the final invocation

Error Found in Angular2 Console Inspection

Storing table rows in an array using Javascript

Display the image title in a separate div when hovering over it

Jenkins running leads to a stuck file download from FTP

What is the best way to incorporate a generated ID into the datepicker() function whenever a button is clicked?

Error: The webdriver is unable to locate the driver executable. Please set the path using the webdriver.chrome.driver system property

Guide to sending JSON data to a server and retrieving it back using AJAX - a detailed breakdown of the

Tips for successfully integrating .dae files into three.js for online execution on a web browser

Is there a way to use Javascript or JQuery to conceal all unchecked items in a RadioButtonList?

Removing item from Angular service

The request payload appears as [Object Object] when initiating the AJAX post request

Creating a jQuery Mobile Multi-Select feature with dynamically loaded data

Using CSS, center a div element both vertically and horizontally, and position the footer at the bottom of the page

Axios - retrieving merchandise

Utilizing AngularJs to differentiate between arrays and strings within an HTML template