[SOLVED] Why isn't localStorage persisting in Chrome?

Why isn't localStorage persisting in Chrome?

I'm trying to learn how to use the localStorage js object with the following code.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function saveStuff() {
    sessionStorage.setItem('sessionKey', 'sessionValue');
    localStorage.setItem('localKey', 'localValue');
}
</script>
</head>
<body>
<button type="button" onclick="saveStuff()">Save</button>
</body>
</html>

I am aware this doesn't always work with file:/// so I'm using mongoose to serve it up. When I click the save button, the results look correct to me in Chrome's JavaScript console. However when I press refresh both the local and the session storage get cleared where I was expecting the local storage value to persist. This happens on both http://127.0.0.1/ and http://localhost/.

Does anyone know why this might be happening? In Settings, Content Settings I have selected 'Allow local data to be set (recommended)' and unticked 'Block third-party cookies and site data'. Am I missing something in my code?

(Chrome Version 23.0.1271.64 m)

Solution

Ok. Thanks must go to pimvdb on this one but here's the solution.

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function saveStuff() {
    sessionStorage.setItem('sessionKey', 'sessionValue');
    localStorage.setItem('localKey', 'localValue');
}
localStorage.getItem('localKey');
sessionStorage.getItem('sessionKey');
</script>
</head>
<body>
<button type="button" onclick="saveStuff()">Save</button>
</body>
</html>

Summary seems to be that that you must attempt a read of the key in order to persist it.

Conclusion: WTF.