Multi-tab sync

How it works

Every tab requests the same Web Lock; the browser grants it to one, and that tab hosts the counter over a BroadcastChannel transport. Every tab — the winner included — connects as a client, so the code is uniform. Close the hosting tab and the lock, and the job, move to another.

void navigator.locks.request(CHANNEL, async () => {
  expose(registry({ counter: define(counter) }), hostTransport)
  hostTransport.announce()     // tells every tab to look up again
  await new Promise(() => {})  // hold the lock for this tab's lifetime
})