views:

17

answers:

0

Hello, everybody, i've encountered the following issue in the Safari 5.0 (not in all WebKit-based browsers), this code:

<html>                                                                                                   
<script>                                                                                             
    var onstorage = function(evt) {                                                                  
            alert([evt.key, evt.oldValue, evt.newValue].join('\n'));                                 
    }                                                                                                

    var onclick = function(evt) {                                                                    
        localStorage.setItem('test', Math.random());                                                 
    }                                                                                                

    var oninit = function() {                                                                        
      //actually, it works the same way with old "plain event" onclick                               
      document.querySelector('#test').addEventListener('click', onclick, false);                     
      window.addEventListener('storage', onstorage, false);                                          
    }                                                                                                

</script>                                                                                            

<body onload="oninit()">                                                                             
    <input id="test" type="button" value="setting a random value"/>                                  
</body>                                                                                              

will trigger on alert, in case we click the button. While this code -

<html>                                                                                                   
<script>                                                                                             
    var onstorage = function(evt) {                                                                  
            alert([evt.key, evt.oldValue, evt.newValue].join('\n'));                                 
    }                                                                                                

    var onclick = function(evt) {                                                                    
        localStorage.setItem('test', Math.random());                                                 
    }                                                                                                

    var oninit = function() {                                                                                           
      window.addEventListener('storage', onstorage, false); 
       //actually, it works the same way with old "plain event" onclick                               
      document.querySelector('#test').addEventListener('click', onclick, false);                                       
    }                                                                                                

</script>                                                                                            

<body onload="oninit()">                                                                             
    <input id="test" type="button" value="setting a random value"/>                                  
</body>                                                                                              

triggers few alerts, as not expected. I do think this is a bug, but can't somebody explain me - why swapping just two lines of codes results in such a weird behaviour?