HTML5 Guidelines for Web Developers

(coco) #1

210 Chapter 8—Web Storage and Offline Web Applications


localStorage. The specification suggests that in such environments, localStorage
should not be used.

8.1.4 The “storage” Event


Every data change in the storage fires a storage event. The storage event offers
read access to the key, the value before and after the change, the script’s URL
that caused the change, and a reference to the storage object where the change
was made.
The implementation of the storage event in current browsers can only be de-
scribed as rather experimental. In Firefox 3.6, for example, the event is fired, but
it does not contain the expected values. In Firefox 4 Beta 3, the event handler
function was not started. Internet Explorer 8 does not know the standard call
for attaching an event handler, window.addEventListener; instead, you have to
use window.onstorage. The expected event then has to be read from the global
window.event. The third Beta version of Internet Explorer 9 did not react to either
event handler. Even Safari 5 did not show results for the storage event. Only Op-
era (version 10.60) and Google Chrome (version 6) returned the expected data for
the storage event.

8.1.5 Debugging


While developing a web application, being able to see the current content of
the persistent storage is very helpful. It is possible to fetch individual elements
via getItem() and display them in an alert() window, but sometimes you just
want to see the items listed as a simple table. Different browsers offer different
options.
Firefox does not have its own graphic interface for displaying storage content; you
need to use a free add-on. Firebug has been renowned among web developers
for years as an indispensable extension of the Firefox browser and naturally also
masters localStorage and sessionStorage. To look at the storage, you only need to
enter the word localStorage or sessionStorage in the console, and the JavaScript
object appears, containing the current values of the storage (see Figure 8.2). If
you want to see the storage content without the Firebug add-on, you can also
use the internal information in Firefox. The data is saved in the background in a
SQLite database (version 3), which can be displayed with the command-line tool
sqlite3. A graphic interface for SQLite is also available as a Firefox add-on: the
brilliant sqlite-manager. The SQLite database file is in the Firefox profile direc-
tory and has the name webappsstore.sqlite.
Free download pdf