Safari 14.1 localStorage between tabs is not syncing

Question

Here is a minimal case that works in Safari 14.0 (and Chrome, Firefox) but not Safari 14.1: https://ffvix.csb.app

1. Open the demo in 2 tabs
2. Input some text and press "Submit"
3. Switch to other tab and press "get"

It should be possible to sync messages via localStorage between 2 tabs hosted on the same domain.

Demo code:

    <h1>To localStorage</h1>
    <form id="form">
      <input id="text" type="text" />
      <input type="submit" />
    </form>

    <h1>From localStorage</h1>
    <button id="getout">get</button>
    <p id="out"></p>

    <script type="text/javascript">
      const form = document.getElementById("form");
      const text = document.getElementById("text");
      const out = document.getElementById("out");
      const getout = document.getElementById("getout");

      form.addEventListener("submit", function (e) {
        localStorage.setItem("test", text.value);
        e.preventDefault();
      });

      function getIt() {
        out.textContent = localStorage.getItem("test");
      }
      getIt();
      getout.addEventListener("click", getIt);
      window.addEventListener("storage", getIt);
    </script>

Answer 1

Confirmed: https://twitter.com/jaffathecake/status/1389493762129375232

Bug: https://bugs.webkit.org/show_bug.cgi?id=225344

I'll update this once I hear of a fix.

---

Fix has shipped as of Version 14.1.2 (16611.3.10.1.6). Tested in two tabs with https://static-misc-3.glitch.me/localstorage-bug/ . The state syncs as expected.