Selenium Upload File On file selection doesn't enable submit button

Question

I've tried

File file = new File("/Users/swapnil.kotwal/Desktop/AntVsGradle.jpg");
driver.findElement(By.xpath("//input[@class='libray_create-resource_choose-file_hidden-input']")).sendKeys(file.getAbsolutePath());

And My HTML is something like below

 <div class="libray_create-resource_choose-file">
      <button class="btn is-hollow_blue libray_create-resource_choose-file_button undefined">Choose File</button>
      <input type="file" class="libray_create-resource_choose-file_hidden-input">
   </div>
   
   <div class="library_create-modal_footer">
      <button class="btn is-text_only btn-cancel undefined">Cancel</button>
     <button class="btn is-filled_blue undefined" disabled="">Add</button>
</div>

I found that file input which is hidden got the file path set properly.

The problem is there Choose File button element is different from file input element //input[@class='libray_create-resource_choose-file_hidden-input']"

There seems to some JS event which make final Add button enable on click of Choose File button.

So, I imported file into file HTML element but how can I enable Add button?

I tried to make that button enabled

WebElement yourButton= driver.findElement(By.className("is-filled_blue"));

JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].removeAttribute('disabled','disabled')",yourButton);

WebDriverWait wait = new WebDriverWait(driver, 20);
wait.until(ExpectedConditions.elementToBeClickable(yourButton));

It makes that button visible but still not allow to actually click on it.

Try to press enter after entering file name: driver.findElement(By.xpath("//input[contains(@id,'html5') and @type='file']")).sendKeys(Keys.ENTER); — Lia
– Lia, Commented Apr 10, 2021 at 16:56
Can you please provide the link to the page you are working with? — Prophet
– Prophet, Commented Apr 10, 2021 at 21:11
Apologies, the business URL I can't share here. It even need login too. :( — Swapnil Kotwal
– Swapnil Kotwal, Commented Apr 11, 2021 at 2:05
When you paste manually the path , does it enable the submit button — Sonali Das
– Sonali Das, Commented Apr 11, 2021 at 4:34

Life is complex · Accepted Answer · 2021-04-18 13:58:08Z

2

+25

First let me say that -- I don't program in Java, -- but I do a lot of selenium coding in Python.

When I was looking at this question from purely a selenium view point I noted that you aren't selecting the choose file button prior to sending your input. I would assume that you have to select this button to enable the element - btn is-filled_blue undefined

Here is some pseudocode that might help trigger that button to switch from disabled to enabled.

File file = new File("/Users/swapnil.kotwal/Desktop/AntVsGradle.jpg");

WebElement select_button = driver.findElement(By.xpath("//*[@class='btn is-hollow_blue libray_create-resource_choose-file_button undefined']"));

select_button.click();

WebElement upload_file = driver.findElement(By.xpath("//input[@class='libray_create-resource_choose-file_hidden-input']"));

upload_file.sendKeys(file.getAbsolutePath());

/* You might need to send an Enter, Return or Tab before the 
   add_file_button changes.  This process requires testing on the website. 

   upload_file.sendKeys(Keys.ENTER); 
   upload_file.sendKeys(Keys.RETURN); 
   upload_file.sendKeys(Keys.TAB); 
*/

boolean add_file_button_presence = driver.findElement(By.className("is-filled_blue")).isDisplayed();
boolean add_file_button_enabled = driver.findElement(By.className("is-filled_blue")).isEnabled();

if (add_file_button_presence==true && add_file_button_enabled==true)
    {
       WebElement add_file_button = driver.findElement(By.className("is-filled_blue"));
       add_file_button.click();
    }

Since I don't normally program in Java the structure and syntax of my pseudocode could be incorrect. If it is please let me know and I will either delete this answer or correct the issues with some research.

edited Apr 18, 2021 at 13:58

answered Apr 18, 2021 at 13:41

Life is complex

15.8k5 gold badges34 silver badges72 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Swapnil Kotwal Over a year ago

Unfortunately. By any way that Windows File Upload pop-up not going away ... tried below options. 1. select_button.click(); select_button.submit(); and 2. action.sendKeys(Keys.ESCAPE).perform(); also 3. select_button.sendKeys(Keys.ESCAPE); & 4. robot = new Robot(); obot.keyPress(KeyEvent.VK_ESCAPE); robot.keyRelease(KeyEvent.VK_ESCAPE); none of this hiding that pop-up on Mac OS

Life is complex Over a year ago

I'm sorry that it didn't work for your use case. I would have posted a second method if you would have gotten back to me with these issues. I still believe that the code above is useful when combined with JavascriptExecutor correctly.

Swapnil Kotwal Over a year ago

Thank you so much Sir.. You are so much supportive. I'll definitely find out some way.. after all each system come up with its own beauty and challenges 🙏🏻

Life is complex Over a year ago

It's hard to troubleshoot this problem remotely. I'm interested in what happens to the "is-filled_blue" button when you do the add file process manually? What Attribute does it get? Enabled?

Swapnil Kotwal Over a year ago

Yes, it enables only when that pop-up get satisfied. I've managed to inject the driver.findElement(By.xpath("//input")).sendKeys(file.getAbsolutePath()); but still that button won't enable. I'll post my final answer and other findings here. don't worry

|

SystemsInCode · Accepted Answer · 2021-04-20 14:39:41Z

1

That undefined class looks suspect - try removing it by adding another js call: js.executeScript("arguments[0].style.removeProperty('undefined')",yourButton);

answered Apr 20, 2021 at 14:39

SystemsInCode

6998 silver badges22 bronze badges

Comments

Nischitha K N · Accepted Answer · 2021-04-20 18:53:59Z

My suggestion would be always limit the usage of JavaScript(JavascriptExecutor) code to an extent it simulates the end user action and not manipulates the application behavior like enabling a button which is disabled functionally etc.

Our purpose is to simulate the application steps in the same way how an end user would use it.

I would suggest to use any third part tool like AutoIt/Sikuli to handle this case since sending file path doesn't enable the 'Add' button automatically as expected

1)Click on the 'Choose File' button using Selenium which opens the upload window, which is not a web component.

2)Since Upload window is not a web component Selenium doesn't support it.

3)Use any third party tools like AutoIt/Sikuli to handle the Windows upload popup by setting the filepath and submit.

4)As we are uploading the file in the UI in the same way how an end user would do, 'Add' button will be enabled automatically.

AutoIt

Swapnil Kotwal · Accepted Answer · 2021-04-26 02:22:44Z

1

Try to use JavascriptExecutor to click it too, before you remove disabled attribute.

WebElement element = driver.findElement(By.xpath("xpath"));
JavascriptExecutor js = (JavascriptExecutor) driver;
js.executeScript("arguments[0].click();", element);

If you use JavascriptExecutor you dont need to make it visible

edited Apr 26, 2021 at 2:22

Swapnil Kotwal

5,7888 gold badges55 silver badges110 bronze badges

answered Apr 14, 2021 at 15:50

Raclos

851 gold badge2 silver badges9 bronze badges

Comments

Swapnil Kotwal · Accepted Answer · 2021-04-27 05:23:32Z

I managed to upload file by using below hack... I never click on Choose File link/button which was launching Upload File Windows pop-up and by any mean that windows pop-up was not going away.

Tried below options.

1.

select_button.click(); 
select_button.submit();

action.sendKeys(Keys.ESCAPE).perform();

select_button.sendKeys(Keys.ESCAPE);

robot = new Robot(); 
robot.keyPress(KeyEvent.VK_ESCAPE); 
robot.keyRelease(KeyEvent.VK_ESCAPE);

none of this hiding that pop-up on Mac OS

So, I found a Jugad(#hack in English) I never click on Choose File button which were launching that Upload File Window

public void uploadFile() {
    WebElement element = driver.findElement(By.className("libray_create-resource_choose-file_hidden-input"));
    element.sendKeys("/Users/swapnil.kotwal/projectName/automation.pdf");
    WebElement addButton = driver.findElement(By.className("is-filled_blue"));
    // click was important, thanks to this answer in this thread   https://stackoverflow.com/a/67095019/1665592
    driver.executeScript("arguments[0].click();", addButton); 
    driver.executeScript("arguments[0].removeAttribute('disabled','disabled'); arguments[0].style = \"\"; arguments[0].style.display = \"block\"; " +
     "arguments[0].style.visibility = \"visible\";", addButton);
    WebDriverWait wait = new WebDriverWait(driver, 20);
    wait.until(ExpectedConditions.elementToBeClickable(addButton));
    addButton.click();
}

This answer deserve an upvote. Congrats on solving this on your end. Some problems are just hard to solve remotely. Happy Coding!!

Collectives™ on Stack Overflow

Selenium Upload File On file selection doesn't enable submit button

5 Answers 5

Since I don't normally program in Java the structure and syntax of my pseudocode could be incorrect. If it is please let me know and I will either delete this answer or correct the issues with some research.

9 Comments

Comments

Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

Since I don't normally program in Java the structure and syntax of my pseudocode could be incorrect. If it is please let me know and I will either delete this answer or correct the issues with some research.

9 Comments

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related