How to access hidden file upload field with Selenium WebDriver python

Question

I have such HTML:

<a id="buttonToUpload" class="btn-pink medium" href="#">
    <span class="icon-arrow-right">upload photo</span>
</a>
<form id="form1" enctype="multipart/form-data">
    <input id="uploadImage" type="file" accept="image/png, image/gif, image/jpeg, image/jpg" style="visibility: hidden">
</form>

Pressing on raise system dialog for choosing file, which I can't access via webdriver. I tried send_keys() directly to but it raises ElementNotVisibleException. So how can I upload photo there? Actual code:

driver = webdriver.Firefox()
driver.get('http://www........')
upload_input = driver.find_element_by_id('uploadImage')
upload_input.send_keys(os.getcwd()+'/image.jpg')

Please try to apply solution proposed here http://stackoverflow.com/questions/15049182/write-value-to-hidden-element-with-selenium-python-script — Andersson, Jun 15 '15 at 12:35

score 5 · Accepted Answer · answered Dec 06 '16 at 07:57

5

Solved with this:

driver.execute_script("document.getElementById('uploadImage'‌).style.visibility='‌visible'")

answered Dec 06 '16 at 07:57

wasd

1,532
3
28
40

score 3 · Answer 2 · answered Oct 29 '16 at 16:30

Execute JavaScript to make the input element visible before interacting with it.

driver.execute_script("""document.querySelector("div.yourClassNameHere input[type=file]").style.display='block'""")

# Send the absolute file path of the file to the input element
input = browser.find_element(:xpath, "//input[@type='file']")
input.sendKeys(os.path.abspath("image.jpg"))

Make sure you replace the queries with ones that make sense for you.

score 0 · Answer 3 · answered Jun 16 '20 at 12:58

I myself ran into this problem where my 'input' element looked like while using Cucumber tests with Selenium:

<input type="file" autocomplete="off" tabindex="-1" style="display: none;">

This is how I solved it:

JavascriptExecutor jse =(JavascriptExecutor) StepDef.driver;
        jse.executeScript("document.querySelector('" + elementSelector +"').style.display='block';");

        util.elementXpathIsVisible(elementXpath);
        StepDef.driver.findElement(By.xpath(elementXpath)).sendKeys(filePath);

How to access hidden file upload field with Selenium WebDriver python

3 Answers3

Linked