Filepond doesnt work with android 4.1, 4.2, 4.4, 5.0, 6.0 (emulator) plain browser

[tohizma]

Summary

Trying open pqina.nl/filepond with plain browser from android emulator version 4.1, 4.2, 4.4, 5.0 and 6.0 doesn't work, it is falled back to default file upload button and not trigger immediate upload Another upload library does work (dropz***, fineu***), but i already implemented Filepond on my webapp, planned to distribute in android's webview app.

Not interested to move to another library. Any work around?

How to reproduce

Just install android emulator x86 images with google API (within android studio) and open demo page of Filepond's own web.

Expected behaviour

It should be working because emulator's browser already supports javascript

Additional information

Android's browser version 4.1.2 - 3876218 (JellyBean 4.1) up to 6.0 -5056751 (Marshmellow 6.0)

Environment	Version
OS	Android
Device	Emulator x86
Browser	Android Emulator Default Browser

[rikschennink]

It's not supported on Android 4.x devices running "Android Browser" but should work on version 5.x and up where the browser is powered by Chrome. I'll run some tests.

[tohizma]

We hope Filepond adding support for old devices, at least those with market usage still above 20% in emerging countries. Hybrid apps mostly depends on android stock's webview. At least should be able to immediate upload even when interface is fall back to default html file upload button (no need for previews, progress and delete button), so it can keep usable by old devices

Thank you.

[rikschennink]

That’s where the supports() is useful, you can use it to test if FilePond is supported on the current browser. If it is not you can fallback to the default file input or use another solution.

Of course we strive to support as many browsers as possible but some browser simply lack the needed APIs and/or are running on devices that are dated and therefor won’t be able to offer a performant experience, in those situations it’s better to offer a performant fallback instead of a broken experience.

[rikschennink]

I've just tested on Android 5.x and 4.4 with the Chrome browser just to be sure. FilePond works as intended.

[rikschennink]

It seems the WebView does not have feature parity with the Chrome browser, so it's possible that it lacks required features (like transforms, visibilityState, Blob, createObjectURL). https://developer.chrome.com/multidevice/webview/overview#what_version_of_chrome_is_it_based_on_

[rikschennink]

It seems that transforms and visiblityState are prefixed in Chromium 30 (which is the chrome engine used on 5.x webview), I'll see if I can find a way that we can prefix these and have it work on Chromium 30.

In my experience, the Android native browser is so buggy that I'm not planning to add support in the near future.

[tohizma]

I've just tested on Android 5.x and 4.4 with the Chrome browser just to be sure. FilePond works as intended.

Yes it is chrome, just works. Unfortunatelly android's webview is not chrome before Kitkat 4.4.

My goal is using using native android app (which is just a webview component, webview features depends on each android versions), doesn't require user to install another browser for accesswing my web app.

For another strange reason, FilePond.supported() doesn't return anything on android's stock webview ( 4.1 - 5.0)

<script>
            FilePond.registerPlugin(FilePondPluginImagePreview, FilePondPluginFileMetadata, FilePondPluginFileValidateSize, FilePondPluginFileValidateType);
            FilePond.setOptions({
                server: 'upload/'
            });
			if (!FilePond.supported()) { $.alert('upload not supported'); } else { $.alert('filepond ok'); }
            const inputElement = document.querySelector('input[type="file"]');
            const pond = FilePond.create( inputElement, 
                    {
                    labelIdle: 'Drag & Drop Foto atau <span class="filepond--label-action">Browse</span>',
                    imagePreviewHeight: 100,
                    maxFileSize: '8MB',
                    allowFileTypeValidation: true,
                    acceptedFileTypes: ['image/png','image/jpeg']                       
                    }
            );
        </script>

Thank you, maybe for now i go through fall back option to send file manually on older devices.

[rikschennink]

For another strange reason, FilePond.supported() doesn't return anything on android's stock webview ( 4.1 - 5.0)

Please test this without any other code or plugins on the page.

[mohsen-zanjani]

Hi @rikschennink ... Is the chunk uploading process in filepond supported by mobile browsers?

I have a project where the upload is done by chunk uploading and it works well on desktop browsers. But in mobile browsers, nothing happens after receiving the response of the POST request from the server (i.e unique location id). This means that patch requests are not sent at all and there are no errors.

Have you tested Chunk uploading on mobile browsers? However, when chunkUploads is set to false, everything works correctly.

This is the server settings:

myServer: {
    url: '/api/chunk-upload/',
    headers: {
        "X-CSRF-Token": document.head.querySelector('meta[name="csrf-token"]').content,
    },
    process: {
        method: 'POST',
        withCredentials: false,
        onload: response => {
            console.log(response);
            if (response instanceof XMLHttpRequest)
                return response.responseText;

            return response;
        },
        onerror: response => {
            console.log(response);
        }
    },
    restore: null,
    load: null,
    fetch: null,
}

Can you give me a hint about how it works and what can I do? ... Thanks ...

[rikschennink]

Hi @mohsen-zanjani can you move this to a separate issue, it's not related to this one.

[mohsen-zanjani]

OK, I created a new issue (#401). Thanks for your response ...