Let’s have a look at some recently landed Web APIs for Firefox


So, without further ado (as there’s been too much “to do” about it) let’s take a look at what we presently have (landed or about to land) regarding our latest (Firefox) Web APIs.

You’ll need the latest xul fennec builds to run these.  Technically, these also run on the latest birch nightly, but that one is presently undergoing a major facelift due to rendering and related issues.

I’d suggest using a tablet. (For the SMS app, you’ll need a phone with simcard and a special build, but we’ll get to that presently).

All example testpages to which we’ll be referring are available under the directory at:  http://people.mozilla.org/~jhammink/webapi_test_pages/

If you find a bug with any of the demos and/or APIs themselves (and we hope you will:) please write them here:

Make sure to include your device model & Android version, as well as the nightly fennec version you are using,  in the bug.

Battery API demo:

This API tests the different charging states of the battery, along with charging level and discharging time.  Try launching the page with the device plugged in, and  then unplugging (and/or vice versa).  Note that the charging/discharging time presently shows Infinity  until the battery has charged/discharged about 2% of its total capacity.

Does the testpage show the correct battery state for the device?  Does it correctly generate an alert when the charging state changes?  Is the level correct (when compared against native battery app level)?  Does it give a numerical discharging/charging time after some time in the same charging state?

Camera API demo:
This API presently tests the browser’s ability to directly capture pictures from the device camera.

Point the device camera at the object you want to shoot  and click capture.

Is the picture rendered correctly (as opposed to  upside down, or sideways) both in the pre-capture and the preview?  Is the picture quality consistent with what your camera normally delivers?  Are there any other issues?  Please feel to play around with it a bit.

IndexedDB API demo:

Since accessing the native file system from the web introduces a huge risk, there needs to be a way to handle offline storage directly on a device.  Enter IndexedDB.   Actually, this api has been around since Firefox 4 (and subsequently for quite a few Chrome and other browser versions since) but the W3C spec got a rewrite recently and it’s been well overdue for an upgrade.

When the browser first tries to create a local database, a prompt requests permission:

Subsequently, once this is allowed, the db initializes, and after some time, reports back on the number of records:

Our current demo matches a hash of zipcodes against a city (you must have zipcodes.csv present in same dir to work – this demo does), doing all the database access operations.  (Note that we’re presently missing the functionality to do the reverse!) Once the CSV is loaded into the device local database, the  lookup should be instantaneous (note that all the steps are not depicted here):

Note that I’ve been getting dramatically different results from device to device.   Sometimes it works, sometimes not.   To be sure the feature is still a work in progress, so let me know what your experiences are.

Vibrator API demo:

Web apps, just like native ones,  need a way to send feedback to various sensors – including notification vibes.   The W3C spec lays a foundation, which we’ve implemented.  Note that you’ll need a device with a vibrator to test this one:

You’ll need a special build for this one also.  Try out each of the scenarios and verify the result.     Are we getting the correct number of buzzes, given the spec?  As with any of our APIs here, you can check the implementation by typing the string “view-source:” (without the quotes) before the “http://….”.  Try it.

SMS API demo:
Note that you’ll need an android phone with a working SIM card to try these demos.  Until this feature lands, you may also may also need a  special build with this feature.


The simplesend is a page that lets you send SMS messages to any phone.  Try it!  Is your message able to get through?  Any other issues?  Note that,  for testing purposes,  you can also try sending the messages directly to the same phone from where they originate.

This next example lets you do exactly that:  send and receive SMS messages from the same webpage instance:

This page is similar to the previous one, but also has an event handler for incoming messages.

Don’t forget to study the page source, for each of these pages, to understand how these APIs are implemented.

And, once again, don’t hesitate to file a bug if something doesn’t appear to be working correctly, or if you have an idea about some features you’d like to see.  

Addendum:  The Web API test pages are now available in github:  https://github.com/jhammink/WebAPI-test-pages