Selenium Webdriver - click on hidden elements

Question

I am trying to automate upload file functionality in Google Drive.

The element used to pass parameters is hidden with height - 0px.

None of the user actions would make this element visible. So I need a work around to click on the element while it is not visible.

<input type="file" style="height: 0px; visibility: hidden; position: absolute; width: 340px; font-size: inherit;" multiple=""/>

The xpath for the above element is -

//*[@class='goog-menu goog-menu-vertical uploadmenu density-tiny']/input

I am using

WebDriver.findElement(By.xpath(<xpath>).sendKeys(<uploadFile>)

Exception -

org.openqa.selenium.ElementNotVisibleException

Element is not currently visible and so may not be interacted with.

I have tried using JavascriptExecutor. But unable to find the exact syntax.

Take a look at the HTML, is Google Drive just a form? If so, don't use Selenium, just write a script to post a form with data you specify. — jasop, Sep 11 '12 at 05:06

score 24 · Accepted Answer · edited Apr 14 '15 at 15:09

Try this:

WebElement elem = yourWebDriverInstance.findElement(By.xpath("//*[@class='goog-menu goog-menu-vertical uploadmenu density-tiny']/input"));
String js = "arguments[0].style.height='auto'; arguments[0].style.visibility='visible';";

((JavascriptExecutor) yourWebDriverInstance).executeScript(js, elem);

The above bunch would change the visibility of your file input control. You can then proceed with the usual steps for file upload like:

elem.sendKeys("<LOCAL FILE PATH>");

Be aware, by changing the visibility of an input field you are meddling with the application under test. Injecting scripts to alter behavior is intrusive and not recommended in tests.

Does this work for the hidden element available in Appium Android platform too? — Ashok kumar Ganesan, Aug 11 '20 at 03:51

score 14 · Answer 2 · edited Oct 17 '18 at 08:37

14

Simple solution:

WebElement tmpElement = driver.finElement(ElementLocator);
JavascriptExecutor executor = (JavascriptExecutor)driver;
executor.executeScript("arguments[0].click();", tmpElement);

edited Oct 17 '18 at 08:37

TheodorosPloumis

2,396
1
17
31

answered May 28 '14 at 02:53

Karthikeyan

2,634
5
30
51

score 2 · Answer 3 · answered Jan 31 '14 at 08:57

2

Try this sample code:

JavascriptExecutor executor= (JavascriptExecutor)driver;
executor.executeScript("document.getElementById('ID').style.display='block';");
Select select = new Select(driver.findElement(By.id("ID")));
select.selectByVisibleText("value");
Thread.sleep(6000);

By using java script executor and make the element visible then click on the element through ID. Hope it hepls..

answered Jan 31 '14 at 08:57

testing

1,736
15
46
75

Why do you need thread sleep? executeScript should be synchronous – riccardo.tasso Sep 04 '18 at 14:44

score 1 · Answer 4 · edited Apr 18 '14 at 14:48

1

Try this:

WebElement elem = yourWebDriverInstance.findElement(
   By.cssSelector(".uploadmenu > input"));
String js = 
  "arguments[0].style.height='auto'; arguments[0].style.visibility='visible';";
((JavascriptExecutor) yourWebDriverInstance).executeScript(js, elem);

Here I have replaced XPath by CSS Selector. Let me know Is the above scripting is working or not.

edited Apr 18 '14 at 14:48

Andrew Barber

39,603
20
94
123

answered Apr 09 '14 at 09:47

user3487861

340
2
2

score 1 · Answer 5 · edited Jun 22 '23 at 18:43

1

You can give the following a try:

((JavascriptExecutor)driver).executeScript("$('.goog-menu.uploadmenu > input').click();");

edited Jun 22 '23 at 18:43

Benjamin Loison

3,782
4
16
33

answered Apr 09 '14 at 10:16

Amith

6,818
6
34
45

Selenium Webdriver - click on hidden elements

5 Answers5

Linked