Sandro Sandro - 1 year ago 93
Javascript Question

Automate file upload in AngularJS via Selenium

I am using Powershell to drive .NET Selenium and a FirefoxDriver to automate some stuff. Part of that is file uploads and the website happens to written (at least partly) with AngularJS.

Now I have figured out how to do automate the file upload with a normal input element. Just send the file path via SendKeys.

But I can't figure it out for this situation. The HTML for the file drop area with optional manual file selector is as follows:

<div class="overflowHidden video-drop-zone file-drop-zone zone appversionicon rounded"
ng-file-drop="onFileSelect($files);" ng-file-drop-available="dropSupported=true">
<div class="simpleDropZoneFileSelect">
<span class="selectFileText">
<span class="ng-binding ng-hide" ng-show="dropLabel !== undefined &amp;&amp; dropLabel !== ''"><br></span>
<a class="ng-binding" href="" ng-show="true">Select file</a>
<input class="" ng-show="true" ng-file-select="onFileSelect($files)" type="file">

I hope I haven't simplified this too much. And there surely is more to the whole AngularJS setup than that. But maybe it is enough for you to give me some pointers as to where to look next or how to approach this. If not, just let me know and I'll add more info.

I have found that Protractor seems to be the way to go when doing AngularJS testing, but it would alter my setup considerably (with a NodeJS server etc.) and all I need right now is this file upload.



Answer Source

Not sure how your entire set up looks like. But file upload is much easier in selenium.


should do it