title: selenium webdriver unable to locate element hidden in div
body: <p>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 <code>driver.findElement</code>  with id, xpath or css. (It is visible on the webpage, however). I get the <code>NoSuchElementException</code></p>
  
  <p>Here is the html of the webpage:</p>
  
  <pre><code>&lt;div id="mainContent" style="overflow:hidden;"&gt;
  &lt;!-- content left here --&gt;
  &lt;div id="contentLeft"&gt;
  &lt;script type="text/javascript" src="/enterprisesolutions/staticcontent/includes/scripts/QuickTask.js"/&gt;
  &lt;script type="text/javascript" src="/enterprisesolutions/Includes/Javascript/date-picker.js"/&gt;
  &lt;div id="quickTask"&gt;
  &lt;h2 class="boxContentHead"&gt;
  &lt;div id="qtBoxContent" class="boxContent quickTaskBack"&gt;
  &lt;!-- Accounts and Maintenance --&gt;
  &lt;div id="qt_accounts_and_maintenance" class="qtStack" style="display:block"&gt;
  &lt;!-- Orders --&gt;
  &lt;div id="qt_orders" class="qtStack" style="display:block"&gt;
  &lt;!-- Invoice --&gt;
  &lt;div id="qt_invoices" class="qtStack" style="display:block"&gt;
  &lt;div class="qtIcon invoices"/&gt;
  &lt;div class="qtContent"&gt;
  &lt;div class="qtTitle"&gt;Invoices&lt;/div&gt;
  &lt;div class="qtForm"&gt;
  &lt;div class="qtLabel qtLabelInvoices"&gt;
  &lt;div class="qtLeftInvoices"&gt;
  &lt;div class="firstField"&gt;
  &lt;div class="qtFormLabel"&gt;Account/Phone/Circuit&lt;/div&gt;
  &lt;div&gt;
  &lt;input id="qt_invoices_text1" type="text" value=""/&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="secondField"&gt;
  &lt;/div&gt;
  &lt;div class="qtRight"&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- Repairs --&gt;
  &lt;div id="qt_repairs" class="qtStack" style="display:block"&gt;
  &lt;!-- Lottery Reporting --&gt;
  &lt;!-- Reporting --&gt;
  &lt;form id="quickTaskForm" name="quickTaskForm" action="/enterprisesolutions/global/quickTaskAction.do" method="post"&gt;
  &lt;!-- QT No Access --&gt;
  &lt;!-- QT Request Access --&gt;
  &lt;div id="qt_request_access" class="qtStackAccess" style="display:block"&gt;
  &lt;/div&gt;
  &lt;div id="qtBottom" class="quickTaskBack" style="background: none repeat scroll 0% 0% transparent;"&gt;
  &lt;/div&gt;
  &lt;!-- start promo and customized pod --&gt;
  &lt;div id="promo_msg"&gt;
  &lt;!-- end promo and customized pod --&gt;
  &lt;/div&gt;
  &lt;!-- end content left--&gt;
  &lt;div id="contentRight" style="height: 845px;"&gt;
  &lt;!-- end content right --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The div with id = mainContent has style of "overflow:hidden" which im guessing is causing the webdriver not find my element.</p>
  
  <p>I have tried the following but they don't work since the field is hidden <code>driver.findElement(By.cssSelector("#qt_invoices_text1")).sendKeys("hi");</code>
  <code>driver.findElement(By.id("qt_invoices_text1")).sendKeys("hi");</code>
  (and with the correct xpath.)</p>
  
  <p>I have heard there is a way around this using JavascriptExecutor but I haven't found one yet. </p>
  
  <p>EDIT: Here is the stacktrace:</p>
  
  <pre><code>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
  </code></pre>
  
  <p>And here is my java code (irrelevant kind of but people kept asking)
  (part of a bigger project this is the only relevant code):</p>
  
  <pre><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();
  </code></pre>
  
  <p>EDIT: I played around with Selenium IDE and it selects the frame before typing with the command <code>SelectFrame _shellbody</code> but when I export it shows this as a comment in the code:
  <code>// ERROR: Caught exception [ERROR: Unsupported command [selectFrame | _shellbody | ]]</code></p>
  
  <p>Any help is appreciated!</p>