LocalStorage.getItem returns old data in IE 9

Question

The following example should be run in IE 9 and in at least two different tabs.

<input type="text" name="data" value="" placeholder="change me" id="data" /> <p id="fromEvent">Waiting for data via <code>storage</code> event...</p> <script type="text/javascript"> window.addEventListener("storage", function (e) { if (e.key == 'storage-event-test') { var newValue = localStorage.getItem('storage-event-test'); // returns old value // var newValue = e.newValue; // returns new value $('#fromEvent').html(newValue); } }, false); $('#data').live('keyup', function () { var changedValue = this.value; $('#fromEvent').html(changedValue); localStorage.setItem('storage-event-test', changedValue); }); </script> 

If he tries to get data with var newValue = localstorage.getItem('storage-event-test'); and test is included in Tab 1 , then it shows correctly test in my <p id="fromEvent"> , but in my tab 2 it writes only tes

Now, if I change the code to use var newValue = e.newValue; , both tabs 1 and tab 2 write test to <p id="fromEvent">

Can someone explain to me why they return different results? I also tested this code in Google Chrome and Firefox and they do not have this problem.

For the record only, it was launched on Win 7 Ultimate 64 SP1 with IIS Express and using jquery-1.5.1. and the error is in 32 and 64 bit version of IE9

Edit Tested with regular IIS 7.5 with the same result

Edit 2 Would it be nice if someone could confirm that this is happening to them?

Answer 1

As to why they return different results, the answer is pretty obvious. The storage event in IE is fired before the value changes, and then in other browsers. You can confirm this by adding a little delay to your code:

 if (e.key == 'storage-event-test') { // e.newValue -> new value // localStorage.getItem('storage-event-test') -> old value in IE setTimeout(function(){ var newValue = localStorage.getItem('storage-event-test'); // new value $('#fromEvent').html(newValue); }, 1); // delay } 

I do not know why this is implemented in this way, although, but I assume that the specification