No se puede ver el evento de almacenamiento local en las pestañas
Estoy tratando de crear una prueba de concepto simple con respecto al uso de localStorage para activar pestañas en mi aplicación cuando se producen cambios. Sé que esto es posible en base a otros artículos que he visto. entiendola especificación afirma que el evento se disparará en cada páginaexcepto en el que estoy, esto es de hecho lo que quiero. Sin embargo, parece que no puedo hacer que esta demostración simple funcione realmente.
Tomé el código a continuación y abrí varias pestañas. Con mis herramientas de desarrollo de Chrome, puedo verificar> localStorage en la consola y ver el valor antes y después de presionar los botones "Agregar" y "Borrar"; de hecho, funcionan como se desea al almacenar y borrar el par de valores clave en local almacenamiento, sin embargo, el evento no dispara la alerta.
Incluso puse puntos de interrupción en el javascript en mis Herramientas de desarrollo de Chrome de cada pestaña, sin embargo, parece que nunca puedo obtener la función "onStorageEvent" en ninguna pestaña abierta.
¿Qué estoy haciendo mal?
<!DOCTYPE html>
<html>
<head>
<title>Tab1</title>
</head>
<body>
<button id="add" onclick="localStorage.setItem('tab','changed')">Add</button>
<button id="clear" onclick="localStorage.clear()">Clear</button>
<script type="text/javascript">
function onStorageEvent() {
alert("storage event: " + localStorage.getItem("tab"));
}
window.addEventListener('storage', onStorageEvent, false);
</script>
</body>
</html>