Viewing html5 storage in Chrome and Firefox

Question

How can I view HTML5 web storage in Chrome and Firefox? What are the best tools available?

Answer 1

try the inspector in Chrome.

Right Click Page > Inspect Element > Resources -> Local Storage

Answer 2

For Firefox use Firebug add-on. Open Firebug. Click on Console. On the command line type in: localStorage

For development you can also edit local storage in Firebug using dot notation. For example:

localStorage.myVar = "hello"
localStorage.clear()
localStorage.removeItem("myVar")

In Firefox 19+ you can inspect localStorage directly from the console without Firebug:

inspect(localStorage)

This will pull up a panel displaying the key/value pairs

Firebug localStorage documentation

Install Firebug add-on

Answer 3

In Firefox the data is saved to the webappstore.sqlite in the FF profile folder. You can view it with the SQLite Manager, an addon for FF.

Answer 4

In Chrome pull down More Tools->Developer Tools. In the panel that appears click the Application tab. You will see LocalStorage in the subsequent menu. You can delete, Edit etc....