Não é possível ver o evento de armazenamento local nas guias
Estou tentando criar uma prova de conceito simples sobre o uso do localStorage para acionar guias no meu aplicativo quando ocorrem alterações. Eu sei que isso é possível com base em outros artigos que eu já vi. Compreendoa especificação afirma que o evento será acionado em todas as páginasexceto aquele em que estou - é de fato o que eu quero. No entanto, não consigo obter essa demonstração simples para realmente funcionar.
Peguei o código abaixo e abri várias guias. Usando minhas Ferramentas de Desenvolvimento do Chrome, posso verificar> localStorage no console e ver o valor antes e depois dos botões "Adicionar" e "Limpar" serem pressionados - eles estão realmente funcionando como desejado ao armazenar e limpar o par de valores-chave no local armazenamento, mas o evento não está disparando o alerta.
Eu até coloquei pontos de interrupção no javascript em minhas Ferramentas de Desenvolvimento do Chrome de cada guia, mas nunca consigo obter a função "onStorageEvent" para pressionar em qualquer guia aberta.
O que estou fazendo errado?
<!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>