click on file input element after calling uploadFile in phantomjs 2

[twalpole]

@route I took a look at the phantomjs and qtwebkit code and realized that while calling uploadFile doesn't actually set the filenames into the file input in Phantomjs 2 - it does set them into the temporary area they get copied from when the file input is triggered. This means that all we need to do is click on the file input after calling uploadFile in Phantomjs2 and it works. We may need to make the version check more granular when 2.0.1 is released depending on how it actually fixes the issue but file upload tests now work with phantomjs 2

[route]

Great research, LGTM

[CyborgMaster]

I'm testing things with the PhantomJS 2.0.1 preview release found here and the work around in this pull request breaks attaching files to hidden input elements. The extra click throws the following error:

Capybara::Poltergeist::MouseEventFailed: Firing a click at co-ordinates [-1413, 366.5] failed. Poltergeist detected another element with CSS selector '' at this position. It may be overlapping the element you are trying to interact with. If you don't care about overlapping elements, try using node.trigger('click').

Since 2.0.1 isn't officially out yet, I didn't want to file a full bug report, but I wanted to document my findings somewhere (sorry if this isn't the right place).

[twalpole]

@CyborgMaster I mentioned this possibility in the original description, so it seems like I'll need to make it do the extra click for version 2.0.0 only -- I'll fix it on the weekend unless someone else submits a PR first.

[twalpole]

Ok -- so I added the 2.0.1 preview release pointed to be @CyborgMaster to travis on my branch - and it does fail the tests, but not the file upload test - https://travis-ci.org/twalpole/poltergeist/jobs/101152646 . There appears to be something strange happening with headers which will require more investigation.

[CyborgMaster]

@twalpole, thanks so much for looking into this. It could be that other things have been fixed since the pre-release (I think it is ~60 commits behind master). Either way, I think everything is working for my use case, except this extra click bug, so I still vote for the 2.0.0 lockdown on the extra click.

[twalpole]

@CyborgMaster The failing tests are around AJAX results never being received/processed in our tests for some reason. I would happily lock down the extra click to only 2.0.0 but the phantom.version.patch still equals 0 in the pre release binary (at least for the mac osx one I download from the location you provided) so there is no way to actually switch behavior currently. Also it would be good to have a failing test for this.

[CyborgMaster]

Ohhh. I didn't think to check the self reported version # for the pre-release binary. Maybe we'll just have to wait for the official release then. Hopefully it will be soon.

Thanks so much for taking the time to look into this for me. I really appreciate it.

[CyborgMaster]

Actually. There is another way we could work around this problem. If you would be willing to make the click work on a hidden file elements (using trigger('click')), then everything would work swimmingly for me. We have a file element that is hidden (well not exactly hidden, just behind another element), so we can style it properly, and the only problem I have with this patch is that the extra click is failing because it's not visible. What do you think about that idea?

[twalpole]

@CyborgMaster I don't think that would work actually, since the reason the extra click is needed is to initiate the upload from the user context. This needs to be a real event, not a JS generated event otherwise it doesnt fix the issue for 2.0.0 - Also, Capybara is designed to emulate a user and since users can't interact with hidden elements neither can most actions in Capybara. The usual fix for this while testing hidden file inputs ( hidden a lot to allow for styling across multiple browsers) is to execute some JS using #execute_script that modifies the elements CSS to make the element visible before calling #attach_file on it.

[CyborgMaster]

@twalpole, that makes a lot of sense. Thanks a ton for explaining all this to me. I really appreciate it. I will take your advice and make the file input visible before attaching to it. That should allow me to use the pre-release with your workaround without any changes. Thanks for the help!

[twalpole]

@CyborgMaster FYI -- looks like 2.0.1 is never going to be released - PhantomJS is going to 2.1 as the next release ariya/phantomjs#12902 (comment)