ariya / phantomjs

Scriptable Headless Browser

Home Page:http://phantomjs.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Webpage.uploadFile not working in phantomjs 2.0

loduis opened this issue Β· comments

This is in linux (Ubuntu)

var
  page     = require('webpage').create(),
  filename = '/media/loduis/DATOS/projects/ghostdriver/test/javascript/local.jpg';



page.onFilePicker = function(oldFile) {

  console.log('Listen event.');

  return filename;
};


page.open('data:text/html,' +
  '<body><form method="POST" enctype="multipart/form-data">' +
  'File to upload: <input type="file" name="upfile" style="width: 200px;height: 100px; background: gray">' +
  '</form></body>', function(status) {

  console.log(status);
  page.uploadFile('input[name=upfile]', filename);

  page.render('test.png');
});

The result on phantomjs 1.9.7 is
test2

while 2.0 is
test

another important thing is that it is never fired onFilePicker

This is a known regression.

What is causing this issue? I'd like to contribute a fix but not sure where to start.

Looks like I was able to track down the cause of the regression issue and I found a suitable workaround (although I'm not sure its the proper fix long-term).

Basically, a change made in Qt 4.8 and incorporated subsequently in Qt 5.0 prevented clicking on file input elements that were not caused by user gestures.

The following patch to comment out the 2 relevant lines in src/qt/qtwebkit/Source/WebCore/html/FileInputType.cpp circumvents that and allows file uploads to work with Phantom 2. I was able to comment those 2 lines and rebuilding Phantom 2 from source.

diff --git a/src/qt/qtwebkit/Source/WebCore/html/FileInputType.cpp b/src/qt/qtwebkit/Source/WebCore/html/FileInputType.cpp
index 7362f63..1a7b148 100644
--- a/src/qt/qtwebkit/Source/WebCore/html/FileInputType.cpp
+++ b/src/qt/qtwebkit/Source/WebCore/html/FileInputType.cpp
@@ -187,8 +187,9 @@ void FileInputType::handleDOMActivateEvent(Event* event)
     if (element()->isDisabledFormControl())
         return;

-    if (!ScriptController::processingUserGesture())
-        return;
+    // PATCH related to #12506 - commented out to allow programmatic form file uploads
+    //if (!ScriptController::processingUserGesture())
+    //    return;

     if (Chrome* chrome = this->chrome()) {
         FileChooserSettings settings;

Here's the bug that tipped me off to the underlying cause. Originally the filtering of clicks for user gestures was done in Source/WebCore/rendering/RenderFIleUploadControl.cpp in the ::click() method but this revision refactored that functionality out and put in FileInputType.cpp.

Since this is a patch, I'm not sure how such things should be handled long-term (i.e. to ensure the patch is re-applied with newer updates to QtWebKit pulled into this repository).

Yes burkestar this works.

I also recompile from the source code

Thanks.

This has solved the issue for me as well. Thank you @burkestar πŸ‘

It would be great to get a fix for this rolled into upstream Qt. We had originally filed a bug in WebKit here: https://bugs.webkit.org/show_bug.cgi?id=75385. It was closed when all Qt related bugs were bulk closed in the WebKit bug tracker.

In capybara-webkit, we work around this by using native clicks to submit file uploads.

fwiw, poltergeist spec showing the error if anyone was looking for a cheap way to repro: teampoltergeist/poltergeist#585

I've tried javascript code example from this issue in phantomjs 2 which is published on your website and upload file is not working. Was it fixed at all?

The patch worked for me ! I can now upload via webdriver !

Thank you @burkestar

Works for me too. Thanks @burkestar!

Just updating that this isn't fixed in the latest version installed by brew.

Seems like we need to patch QT upstream? https://bugs.webkit.org/show_bug.cgi?id=75385 doesn't necessarily seem appropriate, since it was file in 2012 and this issue only just surfaced?

commented

Have there been any updates to fix this besides the patch?

πŸ‘

πŸ‘

commented

I forked and made the update and it works great for me if anyone wants to build the binary off of my fork: https://github.com/stevepm/phantomjs/tree/2.0

Is it possible to merge your fix to the main repository? Which commit fixes this issue? Thanks

Yes, 2.0.1 version will receive this fix

Do you know when approximately 2.0.1 will be published?

commented

@dmitryrechkin I only made one commit. See here: stevepm@5f663b8

Also, just to be clear, all credit goes to burkestar for finding the fix.

@stevepm thanks for pointing us at your fork. I'm going to try to compile a binary from your fork for OS X Yosemite. Unless someone else has already done this?

Could anyone please share the compiled exe for windows for this fix? I am having difficulty compiling.

πŸ‘ on the suggested patch. Thank you!

Hi @stevepm , do you have a windows binary of your fork? (https://github.com/stevepm/phantomjs/tree/2.0) Could you share it?
Thanks

I have Ubuntu/Arch/OSX binaries @ https://github.com/skakri/phantomjs/releases/tag/2.0.1-regression-12506 , if someone needs those.

Thanks @skakri, your build have the patch for upload file gesture πŸ‘ iΒ΄ll try to build on the weekend.

@leopucci if you manage to build it on Windows x68_64, feel free to send me a link to binary @ kristaps.karlsons@gmail.com. I'll add it to downloads.

Ok! :) 🎱

Hey,

has a windows patch for the upload file bug been created? Could someone direct me to the patch this will be extremely helpful!

I compiled a binary for ubuntu 12.04 64bit using the source from @skakri on https://github.com/skakri/phantomjs/releases/tag/2.0.1-regression-12506
The ubuntu binary in the repo threw an error when using it on TravisCI: phantomjs: error while loading shared libraries: libicui18n.so.52: cannot open shared object file: No such file or directory.

I have uploaded the binary on https://github.com/cantonic/phantomjs/releases/tag/2.0.1-regression-12506

Sorry i did not had time to compile for windows yet as i told.

@skakri Thanks for sharing the source. My colleague compiled it for windows, binary is on Dropbox here: https://www.dropbox.com/s/u71vipap8bnm72u/windows-x86_64-phantomjs.exe?dl=0

@samir-mahendra – thanks, added. @cantonic sorry, I've compiled it for Ubuntu 14.04.

still not working.

@geminiyellow Can you give more details on which OS you are using, and the specific test that fails for you? The test script I used to test if it's working is below. You have to run it as follows:

phantomjs --ssl-protocol=any testscript.js

You can then check if the file got uploaded by going to: https://encodable.com/uploaddemo/?action=listfiles

// testscript.js
var webpage = require('webpage'),
system = require('system'),
fname;

if (system.args.length !== 2) {
    console.log('Usage: uploadtest.js filename');
    phantom.exit(1);
} else {
    fname = system.args[1];
    var page = webpage.create();

    page.onConsoleMessage = function(msg) {
        console.log(msg);
    };

    page.open("https://encodable.com/uploaddemo/", function (status) {
        console.log("Page opened, ready to upload file.  Status is", status);
        page.uploadFile('input[name=uploadname1]', fname);
        page.evaluate(function () {
            document.forms[0].submit();
        });
        window.setTimeout(function () {
            phantom.exit();
        }, 3000);
    });
}
commented

+1

Please stop spamming "+1", it adds clutter.

We have a proposal fix for this issue. And it will be landed in 2.0.1. Thanks for your patience.

Fixed in master.