1

I am stumped at the moment as to why I am unable to get the blueimp/jQuery-file-upload plugin to work with the desktop Safari browser. My QA tested with v11.2 (MacOS El Capitan) and I've tested on v13.0.3 (macOS Mojave 10.14.6). Safari doesn't appear to be calling the .fileupload() function. However, the plugin works as expected in both Chrome and Firefox.

Here's the bare bones code I've been using for testing.

Html

<input class="upload" type="file" name="FileData" id="fileupload-remove-items" data-url="/analysis/upload"/>

JS:

  $('#fileupload-remove-items').fileupload({
        dataType: 'json',
        start: function (e, data){
            console.log('start'); // fires in Chrome & Firefox browsers, but *not* Safari
        },
        progress: function (e, data){
            console.log('progress');  // fires in Chrome & Firefox browsers, but *not* Safari
        },
        done: function (e, data) {
            console.log('done'); 
        }
    });

In both Firefox & Chrome the console.log() fires as expected. But nothing happens at all in Safari. I haven't been able to find any related SO posts or bug reports in the repo that answer this question so I'm now reaching out here. Can anyone else replicate this issue? Interestingly, I am able to upload a file from the demo page using Safari but looking through the demo code thus far has not made it clear how this simple use case consistently fails with Safari.

Any help would be most welcome. Thanks ahead of time!

EDIT: I should note that Safari is listed as a supported browser for this plugin. I am using the most recent version of the plugin v10.3.0.

afenix
  • 21
  • 8
  • For posterity, it seems that I am experiencing a related bug discussed (but not resolved) here: https://forums.envato.com/t/uploading-problem-choose-file-macos-sierra-safari-11/153018/12 – afenix Nov 19 '19 at 22:34
  • I have also made sure that this is not an issue related to my input being hidden: https://stackoverflow.com/questions/24980459/safari-input-file-doesnt-work/24980606 – afenix Nov 20 '19 at 00:11
  • Another tidbit: I have verified with BrowserStack that this _does_ work with older Safari browsers: – afenix Nov 20 '19 at 00:26

1 Answers1

0

I was finally able to find the culprit after creating a jsFiddle that actually did work in Safari v11+. By dissecting my site I found out where the variance was. And the winner is... the version of jQuery that my legacy website was using - specifically, jQuery v1.7.2. When I swapped that old version for a more recent v2.2.4, Safari v11+ immediately started to behave. It actually also works with jQuery v1.8. Easy enough to miss since the Readme.md lists the Mandatory requirements as jQuery v1.6+.

I'll let the authors know that this is no longer the case for newer Safari browsers. I hope that this saves someone time in the interim, if there is anyone out there still using 1.7.2 that is ;)

Adelante!

afenix
  • 21
  • 8
  • I'm experiencing similer kind of issue, this time the Safari versions are 12.1.2 and 13. jQuery version is 3.3.1. Although it allows me to browse and select the file, clicking on "Upload" button does nothing. There are no console errors or any other clue to troubleshoot this. Could you please share your thoughts on this? – Asanga Dewaguru Feb 10 '20 at 05:23