How do you click on an element which is hidden using Selenium WebDriver?

We can click on an element which is hidden with Selenium webdriver. The hidden elements are the ones which are present in the DOM but not visible on the page. Mostly the hidden elements are defined by the CSS property style=”display:none;”. In case an element is a part of the form tag, it can be hidden by setting the attribute type to the value hidden.

Selenium by default cannot handle hidden elements and throws ElementNotVisibleException while working with them. Javascript Executor is used to handle hidden elements on the page. Selenium runs the Javascript commands with the executeScript method. The commands to be run are passed as arguments to the method.

Now let us enter some text inside the hidden text box.

// Javascript executor class with executeScript method
      JavascriptExecutor j = (JavascriptExecutor) driver;
      // identify element and set value
      j.executeScript ("document.getElementById('text-box').value='Selenium';");
      String s = (String) j.executeScript("return document.getElementById('text-box').value");
      System.out.print("Value entered in hidden field: " +s);