Having problem in file upload using selenium

Question

I am learning to automate procress in a website. I chose http://logos.iti.gr/logos/ as a website to automate. I am facing a problem when uploading the image file using the upload an image button because this button when clicked seems to convert into a text field.

The other tutorials I followed get the id of the text field and use sendkeys to send the path because they do have separate text field and upload button key.

Here is the code that I tried :

 driver.get("http://logos.iti.gr/logos/");
 driver.findElement(By.id("fileToUpload")).clear();
 System.out.println("Cleared");              
 driver.findElement(By.id("fileToUpload")).sendKeys("/home/test.jpg");

I don't know what the problem is. It just get IPDL protocol error: Handler returned error code!

org.openqa.selenium.ElementNotInteractableException: Element <input id="fileToUpload" class="input_file" name="fileToUpload" type="file"> could not be scrolled into view
Build info: version: '3.141.5', revision: 'd54ebd709a', time: '2018-11-06T11:42:16'

Are you using the geckodriver? i.e. the test is launching a Firefox browser. — Timothy T.
– Timothy T., Commented Nov 9, 2018 at 3:17

Vladimir Efimov · Accepted Answer · 2018-11-09 12:39:57Z

You get ElementNotInteractableException - it is thrown to indicate that although an element is present on the DOM, it is not in a state that can be interacted with. In your case it happens because the element has style display:none. Basically, selenium (and real users as well) can't interact with non-visible elements. You need to make element visible at the frist place and then continue.

    driver.get("http://logos.iti.gr/logos/");
    WebElement el = driver.findElement(By.id("fileToUpload"));
    System.out.println("Making element visible");  
    ((JavascriptExecutor)driver).executeScript("arguments[0].style.display = 'block';", el);
    el.clear();
    System.out.println("Cleared");              
    el.sendKeys("/home/test.jpg");

By the way here is the default element style (you can see it in browser dev tools). Pay attention to display:none. When you change the value to block don't be confused that you actually don't see any changes on a screen because element's width and height are very small.

.input_file {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
    display: none;
}

Mohamed Anees A · Accepted Answer · 2018-11-09 03:55:10Z

0

Try updating your client and Firefox. Hopefully that should solve this issue.

I have never faced any issue with file uploads until the webpage mandates the dialog box while clicking the image upload. I am using latest version of ChromeDriver and Chrome.

If possible, you too switch to ChromeDriver since I find the pair working seamlessly together in my experience! :)

answered Nov 9, 2018 at 3:55

Mohamed Anees A

4,6612 gold badges25 silver badges37 bronze badges

1 Comment

nzy Over a year ago

I already have the latest version of firefox and selenium. I still have not solved it. I did not get any luck with the chrome too. I think its something to do with how the button changed to the text box but I couldn't figure out how to automate this.

Collectives™ on Stack Overflow

Having problem in file upload using selenium

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related