Jason Green
Jason Green

Reputation: 171

Selenium WebDriver Upload File With Input Type of "text"

I'm attempting to upload a file into a form, but there is no input element with the type of "file".

I'm able to remove the "readonly" attribute and send keys to the input text box, but it throws a general error when I click the upload button. (just a popup with no useful information)

This is the element as presented:

<input type="text" autocomplete="off" class="form-control animate-show 
ng-pristine ng-empty ng-invalid ng-invalid-required ng-touched" 
id="filepath" ng-model="model.name" ng-required="configuration.Required" 
readonly="" required="required" style="">

This is the element after selecting a file manually:

<input type="text" autocomplete="off" class="form-control animate-show 
ng-pristine ng-touched ng-not-empty ng-valid ng-valid-required" 
id="filepath" ng-model="model.name" ng-required="configuration.Required" 
readonly="" required="required" style="">

This is the element after removing "readonly" and sending my file path via selenium:

<input type="text" autocomplete="off" class="form-control animate-show 
ng-touched ng-not-empty ng-dirty ng-valid-parse ng-valid ng-valid-required" 
id="filepath" ng-model="model.name" 
ng-required="configuration.Required" required="required" style="">

Test setup: Ubuntu 20 python 3.8 chrome 91.0.4472.114 selenium 3.141.0

Update: I found the input field below with the type of "file", but it's located at the bottom of the page. (not within the expected modal) Passing the path to this element was successful (no selenium errors), but the upload process still failed.

<label tabindex="-1" style="visibility: hidden; position: absolute; 
overflow: hidden; width: 0px; height: 0px; border: none; margin: 0px; 
padding: 0px;">upload<input type="file" ngf-select="" 
ng-model="model" ng-show="!model"></label> 
"upload" 
<input type="file" ngf-select="" ng-model="model" ng-show="!model"> 
<label tabindex="-1" style="visibility: hidden; position: absolute; 
overflow: hidden; width: 0px; height: 0px; border: none; margin: 0px; 
padding: 0px;">upload 
<input type="file" ngf-select="" ng-model="model" ng-show="!model">
</label>

Upvotes: 0

Views: 1664

Answers (1)

Jason Green
Jason Green

Reputation: 171

It turns out there was an element with type="file in a different section of the page. Accessing the correct element and using send_keys with the file path worked perfectly. The original text box in question was populated with the file name and the file upload occurred properly.

Thank you for everyone's input, especially @YaDavMaNish with the syntax that ultimately got this working.

Upvotes: 1

Related Questions