Android can be a nightmare for HTML5 and PhoneGap developers
I’ve been working on some code for signature capture on a mobile device that really demonstrated to me the problems with trying to develop a HTML5 app for an Android device.
Here’s the scenario. I’m displaying a canvas element which allows the user to scribble out their signature. When ready to upload, I convert the canvas to a Base64 encoded image and upload to a remote SQL database. Simple enough to do with Mobile Safari. But with my Samsung Galaxy Note 8, it’s a whole new ballgame.
I started out testing with the default Samsung browser, which is important to support because that is the browser that will be used in any PhoneGap application. The developer doesn’t have the option of selecting the browser they want to include with PhoneGap. Testing proved that you could at least draw on the canvas, but things fell apart quickly when uploading the canvas. Ok .. I’ll get back to that.
Next I tried using the most recent Chrome browser on the Galaxy Note 8. This is version (27.0.1453.90) as of today. I loaded up the test page, tried to scribble out something on the canvas and guess what .. nothing. So I now spend far too much time trying to figure out if there is something wrong with my touch event handlers (no), then I finally start searching the web for other reports of problems and finally find this gem .. Canvas broken in Chrome Browser. Great .. the damn Canvas element is broken .. you can’t draw on it. Well .. maybe the next update will fix that. Ok so forget about Chrome.
Next, let’s give FireFox a spin. Allright (JOY) … everything works as expected. Canvas works, image uploads work. Life is good.
But .. I’ve got to figure out what is going on with the native Samsung Browser. So the first question is, how do I debug the JavaScript on the device? I can’t use any of the Android tools, they only work with Chrome. So I’m stuck using JavaScript alerts trying to figure out exactly where the code is failing. And unfortunately it turned out to be failing in multiple places.
In a nutshell here’s what I found out.
The native Samsung browser (some webkit derivative) has no support for a JavaScript Blob object.
It delivers NOTHING when using an XHR2 upload with a binary or arraybuffer payload. It appears to work but you will see no data at the server.
JPG export from the Canvas element is not supported. Always converts the canvas to PNG
Continued HTML5 Android support is going to be a BEAR because of so many devices, so many versions of the Android OS and ALL of the numerous browsers/versions. This will become a MAJOR time sink.
I think Microsoft has an outstanding opportunity to displace Android and go head to head with Apple in the business marketplace, assuming they build the hardware and software for the phone/tablet. When you really dig into Android, it’s not a pretty picture. Poor software quality control, too much diversity. I can’t imagine any corporate developer betting on Android at this point.