Same-origin tab count tracker with BroadcastChannel

example.js

const tcs = new TabCountSync();
window.addEventListener("unload", () => tcs.close());

tcs.subscribe(count => console.log("open tab count: ", count));

TabCountSync.js

class TabCountSync {
  constructor() {
    this.bc = new BroadcastChannel("tabcount-sync");
    this.bc.postMessage("opened");
    this.bc.onmessage = (ev) => this.onMessage(ev);

    this.count = 1;
    this.subscriptions = new Set();
  }

  subscribe(callback) {
    this.subscriptions.add(callback);
    callback(this.count);
    return () => this.subscriptions.delete(callback);
  }

  setCount(count, sync = true) {
    this.count = count;
    this.subscriptions.forEach(fn => fn(count));
    if (sync) {
      this.bc.postMessage(this.count + 1);
    }
  }

  close() {
    if (!this.closed) {
      this.bc.postMessage("closed");
      this.bc.close();
      this.closed = true;
    }
  }

  onMessage({data}) {
    if (this.closed) {
      return;
    }

    if (data === "opened") {
      this.setCount(this.count + 1);
    } else if (data === "closed") {
      this.setCount(this.count - 1);
    } else if (typeof data === "number") {
      if (this.count > data) {
        this.bc.postMessage(this.count);
      } else if (this.count !== data) {
        this.setCount(data, false);
      }
    }
  }
}