Handling of hidden webelements in Selenium Webdriver

In Selenium webdriver you will get many scenarios where you will find hidden elements and when you try to perform any operations then you will get the exceptions. You will get Element not visible exception which will terminate the program.

Hidden elements  Male Female

Normal Scenario Java C# Python Ruby

Hobbies Singing Coding

In this tutorial, we will discuss How to handle hidden web elements in Selenium Webdriver.

Elements are hidden on the web-pages due to below-mentioned reasons - 

• They have a CSS display value of none.

          style=”display: none;”

• They are form elements with type="hidden"
• Their width and height are explicitly set to 0.
• An ancestor element is hidden, so the element is not shown on the page.

Issue - Selenium does not allow to interact with an element which is hidden on the web-page and if we try to do so, then it will throw ''Element Not Visible Exception".

Solution - Selenium provides one feature called 'Javascript Executor' to handle such scenario.

Explanation -

• JavascriptExecutor - It is an interface provided by Selenium WebDriver to execute Javascript commands in the Selenium Script.
• getElementById() - It is a Javascript method that is used to locate an element on the web-page using ID attribute of that element.
• executeScript() - It is a method of JavascriptExecutor interface to execute the javascript commands in the Selenium Script.

Note - Since the text box is hidden, so you won't be able to see the text entered in the text box. Run the program and you will find that it runs successfully without any exception. Now,  If you click on the 'Show' button then you will see the text is entered in the box

package com.automation.eng.AutomationProject;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;

import org.openqa.selenium.JavascriptExecutor;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.chrome.ChromeDriver;

import org.openqa.selenium.firefox.FirefoxDriver;

import org.testng.annotations.Test;

import io.github.bonigarcia.wdm.WebDriverManager;

public class hiddenWebelement {

public WebDriver driver;

@Test

public void handlingHiddenWebElement() {

// System.setProperty("webdriver.chrome.driver", "C:/Dev/libs/chromedriver_win32/chromedriver.exe");

// driver =new ChromeDriver();

//setup the firefoxdriver using WebDriverManager

WebDriverManager.firefoxdriver().setup();

//Create driver object for Chrome

driver = new FirefoxDriver();

driver.manage().timeouts().pageLoadTimeout(60, TimeUnit.SECONDS);

driver.manage().timeouts().implicitlyWait(90, TimeUnit.SECONDS);

driver.manage().window().maximize();

driver.manage().deleteAllCookies();

driver.get("https://learn.letskodeit.com/p/practice");

//Clicking on the Hide button

driver.findElement(By.xpath("//input[@id='hide-textbox']")).click();

JavascriptExecutor js = (JavascriptExecutor)driver;

// Identifying the element using ID attribute and Entering the value in the text box

js.executeScript("document.getElementById('displayed-text').value='text123'");

}

}

/*

* PASSED: handlingHiddenWebElement

===============================================

Default test

Tests run: 1, Failures: 0, Skips: 0

===============================================

===============================================

Default suite

Total tests run: 1, Passes: 1, Failures: 0, Skips: 0

===============================================

* /

*/

// Another example to handling of hidden webelement

package com.automation.eng.AutomationProject;

import java.util.List;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;

import org.openqa.selenium.JavascriptExecutor;

import org.openqa.selenium.WebDriver;

import org.openqa.selenium.WebElement;

import org.openqa.selenium.chrome.ChromeDriver;

import org.openqa.selenium.firefox.FirefoxDriver;

import org.testng.annotations.Test;

import io.github.bonigarcia.wdm.WebDriverManager;

public class hiddenWebelement2 {

public WebDriver driver;

@Test

public void handlingHiddenWebElement() {

//setup the firefoxdriver using WebDriverManager

WebDriverManager.firefoxdriver().setup();

//Create driver object for Chrome

driver = new FirefoxDriver();

driver.manage().timeouts().pageLoadTimeout(60, TimeUnit.SECONDS);

driver.manage().timeouts().implicitlyWait(90, TimeUnit.SECONDS);

driver.manage().window().maximize();

driver.manage().deleteAllCookies();

driver.get("http://seleniumpractise.blogspot.com/2016/08/");

//webelement - the Hide button

List<WebElement> radio = driver.findElements(By.id("male"));

int count = radio.size();

System.out.println("Total buttons " + count);

for (int i = 0; i < count; i++) {

WebElement ele = radio.get(i);

int x = ele.getLocation().getX();

if(x!=0) {

ele.click();

break;

}

}

}

}

/*

Total buttons 2

PASSED: handlingHiddenWebElement

===============================================

Default test

Tests run: 1, Failures: 0, Skips: 0

===============================================

===============================================

Default suite

Total tests run: 1, Passes: 1, Failures: 0, Skips: 0

===============================================

* /

*/