selenium webdriver无法找到div中隐藏的元素

Question

I am using the selenium firefox webdriver in my java program. I am trying to type a string into a textbox and click submit. However, the textbox is nested in a hidden element so I can't access it using driver.findElement with id, xpath or css. (It is visible on the webpage, however). I get the NoSuchElementException

Here is the html of the webpage:

<div id="mainContent" style="overflow:hidden;">
<!-- content left here -->
<div id="contentLeft">
<script type="text/javascript" src="/enterprisesolutions/staticcontent/includes/scripts/QuickTask.js"/>
<script type="text/javascript" src="/enterprisesolutions/Includes/Javascript/date-picker.js"/>
<div id="quickTask">
<h2 class="boxContentHead">
<div id="qtBoxContent" class="boxContent quickTaskBack">
<!-- Accounts and Maintenance -->
<div id="qt_accounts_and_maintenance" class="qtStack" style="display:block">
<!-- Orders -->
<div id="qt_orders" class="qtStack" style="display:block">
<!-- Invoice -->
<div id="qt_invoices" class="qtStack" style="display:block">
<div class="qtIcon invoices"/>
<div class="qtContent">
<div class="qtTitle">Invoices</div>
<div class="qtForm">
<div class="qtLabel qtLabelInvoices">
<div class="qtLeftInvoices">
<div class="firstField">
<div class="qtFormLabel">Account/Phone/Circuit</div>
<div>
<input id="qt_invoices_text1" type="text" value=""/>
</div>
</div>
<div class="secondField">
</div>
<div class="qtRight">
</div>
</div>
</div>
<!-- Repairs -->
<div id="qt_repairs" class="qtStack" style="display:block">
<!-- Lottery Reporting -->
<!-- Reporting -->
<form id="quickTaskForm" name="quickTaskForm" action="/enterprisesolutions/global/quickTaskAction.do" method="post">
<!-- QT No Access -->
<!-- QT Request Access -->
<div id="qt_request_access" class="qtStackAccess" style="display:block">
</div>
<div id="qtBottom" class="quickTaskBack" style="background: none repeat scroll 0% 0% transparent;">
</div>
<!-- start promo and customized pod -->
<div id="promo_msg">
<!-- end promo and customized pod -->
</div>
<!-- end content left-->
<div id="contentRight" style="height: 845px;">
<!-- end content right -->
</div>

The div with id = mainContent has style of "overflow:hidden" which im guessing is causing the webdriver not find my element.

I have tried the following but they don't work since the field is hidden driver.findElement(By.cssSelector("#qt_invoices_text1")).sendKeys("hi"); driver.findElement(By.id("qt_invoices_text1")).sendKeys("hi"); (and with the correct xpath.)

I have heard there is a way around this using JavascriptExecutor but I haven't found one yet.

EDIT: Here is the stacktrace:

Exception in thread "main" org.openqa.selenium.NoSuchElementException: Unable to locate element: {"method":"css selector","selector":"#qt_invoices_text1"}
Command duration or timeout: 20.18 seconds
For documentation on this error, please visit: http://seleniumhq.org/exceptions/no_such_element.html
Build info: version: '2.33.0', revision: '4e90c97', time: '2013-05-22 15:33:32'
System info: os.name: 'Windows 8', os.arch: 'amd64', os.version: '6.2', java.version: '1.7.0_21'
Session ID: 334122ae-6eab-4036-96ca-1183c9129b51
Driver info: org.openqa.selenium.firefox.FirefoxDriver
Capabilities [{platform=XP, databaseEnabled=true, cssSelectorsEnabled=true, javascriptEnabled=true, acceptSslCerts=true, handlesAlerts=true, browserName=firefox, browserConnectionEnabled=true, nativeEvents=true, webStorageEnabled=true, rotatable=false, locationContextEnabled=true, applicationCacheEnabled=true, takesScreenshot=true, version=21.0}]
    at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
    at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:57)
    at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:45)
    at java.lang.reflect.Constructor.newInstance(Constructor.java:525)
    at org.openqa.selenium.remote.ErrorHandler.createThrowable(ErrorHandler.java:191)
    at org.openqa.selenium.remote.ErrorHandler.throwIfResponseFailed(ErrorHandler.java:145)
    at org.openqa.selenium.remote.RemoteWebDriver.execute(RemoteWebDriver.java:554)
    at org.openqa.selenium.remote.RemoteWebDriver.findElement(RemoteWebDriver.java:307)
    at org.openqa.selenium.remote.RemoteWebDriver.findElementByCssSelector(RemoteWebDriver.java:396)
    at org.openqa.selenium.By$ByCssSelector.findElement(By.java:407)
    at org.openqa.selenium.remote.RemoteWebDriver.findElement(RemoteWebDriver.java:299)
    at DownloadInvoice.read(DownloadInvoice.java:282)
    at DownloadInvoice.main(DownloadInvoice.java:406)
Caused by: org.openqa.selenium.remote.ErrorHandler$UnknownServerException: Unable to locate element: {"method":"css selector","selector":"#qt_invoices_text1"}
Build info: version: '2.33.0', revision: '4e90c97', time: '2013-05-22 15:33:32'
System info: os.name: 'Windows 8', os.arch: 'amd64', os.version: '6.2', java.version: '1.7.0_21'
Driver info: driver.version: unknown

And here is my java code (irrelevant kind of but people kept asking) (part of a bigger project this is the only relevant code):

driver.get(sheet.getCell(j+1,i).getContents());
                driver.findElement(By.id("UserId")).click();
                driver.findElement(By.id("UserId")).clear();
                driver.findElement(By.id("UserId")).sendKeys(sheet.getCell(j+2,i).getContents());
                Thread.sleep(1000);
                driver.findElement(By.id("PASSWORD")).click();
                driver.findElement(By.id("PASSWORD")).clear();                                
                driver.findElement(By.id("PASSWORD")).sendKeys(sheet.getCell(j+3,i).getContents());
                Thread.sleep(5000);
                driver.findElement(By.id("submit")).click();
                Thread.sleep(2000);
            driver.findElement(By.cssSelector("#qt_invoices_text1")).sendKeys("hi");
driver.findElement(By.id("submit")).click();

EDIT: I played around with Selenium IDE and it selects the frame before typing with the command SelectFrame _shellbody but when I export it shows this as a comment in the code: // ERROR: Caught exception [ERROR: Unsupported command [selectFrame | _shellbody | ]] // ERROR: Caught exception [ERROR: Unsupported command [selectFrame | _shellbody | ]]

Any help is appreciated!

Answer 1

Try use WebDriverWait , it makes no sense talking about visibility now, because the exception is NoSuchElementException , which means the element is not there. After resolve this exception, then we can move through talking about visibility.

driver.switchTo().frame(0); // use this if it's in frame and you don't know how to locate it
WebElement input = (new WebDriverWait(driver, 15)).until(ExpectedConditions.presenceOfElementLocated(By.id("qt_invoices_text1")));

Also just a heads up, don't use Thread.Sleep() , use WebDriverWait please.

Answer 2

Even after sufficient wait, if it doesn't work then try JSExecutor.

JavascriptExecutor js = (JavascriptExecutor)driver;

js.executeScript("document.getElementById(div element id).click()");

This should work.....

Answer 3

Need some wait, while executing the script your application takes some time to load the hidden element meanwhile selenium goes one step ahead & try to find the element but element not found because this element not yet loaded so, it check once and thrown an exception. use WebDriverWait take advantage over Thread.Sleep() .