how to upload programatically a file on a page that uses kendo UI upload widget

Question

I'm writing some automation tests using Selenium. I'm on a page that contains kendoUI widgets, such as dropdownlist, textbox, and uploadfile. The way I've been able to deal with the dropdownlist and other elements was to just make calls using the kendo framework.

var x = $('#myId').data('kendoDropDownList')
x.value('1');
x.trigger('change');

Runing the above code allows me to select an item from the dropdownlist.

I'd like to do the same with the upload widget. Thus, the first step was to get the the upload widget reference like this:

var y = $('#myId').data('kendoUpload');

I'fd like to know which how do I open the programatically the file explorer to select a file?

Thanks for helping.

stackoverflow.com/a/28716332/2074346 is this ur are looking for ? — Kishore Sahasranaman
– Kishore Sahasranaman, Commented Oct 16, 2015 at 16:23
That can be a good start. However, the problem with Kendo wigdets is that they don't rely on their own library to perform tasks. After struggling to select value using just simple methods, such as click, I leard the hard way that I need first to reference kendo widget then use methods from their library to make things work. — Richard77
– Richard77, Commented Oct 16, 2015 at 16:34
you can get the reference from their web site. docs.telerik.com/kendo-ui/api/javascript/ui/upload — Kishore Sahasranaman
– Kishore Sahasranaman, Commented Oct 16, 2015 at 16:42
I've read their website. The earliest event that they talk about is "onUpload", which is after the user has already selected the file. But before that, clicking on the button "Select files..." is not doing anything. I've also tried triggering several event manually, such as click, change, using for instance this .trigger('select') ...no success. — Richard77
– Richard77, Commented Oct 16, 2015 at 20:33
that is not a kendo issue , that is a general browser security restriction . see this stackoverflow.com/q/793014/2074346 — Kishore Sahasranaman
– Kishore Sahasranaman, Commented Oct 17, 2015 at 3:45

StrikerVillain · Accepted Answer · 2015-10-16 21:30:03Z

2

I was able to upload file in the example of Kendo UI at http://demos.telerik.com/kendo-ui/upload/index using the following Selenium IDE code. First we find the select\upload input tag and send location of the file to be uploaded. After that find the submit button and click.

type    | id=files                        | <path>\Desktop\New Text Document.txt
pause   | 3000                            | 
click   | css=input.k-button.k-primary    |

I am not aware about the correct syntax in JQuery but I think you get the idea. Programatically opening the file explorer and then selecting the file cannot be handled by Selenium as Selenium can access only HTML components.

You can click on the Select button using Selenium and then can maybe use APIs like AutoIt or SIKULI to handling the file selection part through the file explorer.

Hope this helps you.

answered Oct 16, 2015 at 21:30

StrikerVillain

3,8262 gold badges26 silver badges43 bronze badges

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

4 Comments

Richard77 Over a year ago

Wow! I'm completely surprised. Usually, Kendo UI widget works when you access their own api. That's why I didn't even try directly selenium. Thanks a lot. I almost gave up.

StrikerVillain Over a year ago

As per my understanding... Any widgets/app based on HTML which renders in a browser will have html source code and we can use this in Selenium... So while considering using Selenium I just check if HTML code is visible in the developer console

Richard77 Over a year ago

You are right. The only problem sometimes is that the HTML is a bunch of nested span so that it's hard to tell which one is meant to represent the element.

StrikerVillain Over a year ago

Yeah .. With these JavaScript, css and jquery based Web page development, finding the right tags is getting very difficult. Even if we manage to find them, their properties might change based on focus, clicks... I miss the good old pure html days when a span was a span, not some genetically (javascript) modified span acting as a button

sysofadown3 · Accepted Answer · 2018-08-24 02:04:44Z

0

This has been causing me a headache. To anyone else that encounters this, basically when you're sending the file path send it to the input tag within the div, even though it may not have all the properties of the upload button.

answered Aug 24, 2018 at 2:04

sysofadown3

912 silver badges5 bronze badges

Collectives™ on Stack Overflow

how to upload programatically a file on a page that uses kendo UI upload widget

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related