@xiboplayer/sync 0.1.1

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@xiboplayer/sync",
+  "version": "0.1.1",
+  "description": "Multi-display synchronization for Xibo Player",
+  "type": "module",
+  "main": "src/sync-manager.js",
+  "exports": {
+    ".": "./src/sync-manager.js"
+  },
+  "scripts": {
+    "test": "vitest run",
+    "test:watch": "vitest"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "vitest": "^2.0.0"
+  },
+  "keywords": [
+    "xibo",
+    "digital-signage",
+    "sync",
+    "multi-display"
+  ],
+  "author": "Pau Aliagas <linuxnow@gmail.com>",
+  "license": "AGPL-3.0-or-later",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/xibo-players/xiboplayer.git",
+    "directory": "packages/sync"
+  }
+}

package/src/sync-manager.js

@@ -0,0 +1,414 @@
+/**
+ * SyncManager - Multi-display synchronization via BroadcastChannel
+ *
+ * Coordinates layout transitions across multiple browser tabs/windows
+ * on the same machine (video wall, multi-monitor setups).
+ *
+ * Protocol:
+ *   Lead                              Follower(s)
+ *   ────                              ──────────
+ *   layout-change(layoutId, showAt)  →  receives, loads layout
+ *                                    ←  layout-ready(layoutId, displayId)
+ *   (waits for all followers ready)
+ *   layout-show(layoutId)            →  shows layout simultaneously
+ *
+ * Heartbeat:
+ *   All nodes broadcast heartbeat every 5s.
+ *   Lead tracks active followers. If a follower goes silent for 15s,
+ *   it's considered offline and excluded from ready-wait.
+ *
+ * @module @xiboplayer/sync
+ */
+
+/**
+ * @typedef {Object} SyncConfig
+ * @property {string} syncGroup - "lead" or leader's LAN IP
+ * @property {number} syncPublisherPort - TCP port (unused in browser, kept for compat)
+ * @property {number} syncSwitchDelay - Delay in ms before showing new content
+ * @property {number} syncVideoPauseDelay - Delay in ms before unpausing video
+ * @property {boolean} isLead - Whether this display is the leader
+ */
+
+const CHANNEL_NAME = 'xibo-sync';
+const HEARTBEAT_INTERVAL = 5000;   // Send heartbeat every 5s
+const FOLLOWER_TIMEOUT = 15000;    // Consider follower offline after 15s silence
+const READY_TIMEOUT = 10000;       // Max wait for followers to be ready
+
+export class SyncManager {
+  /**
+   * @param {Object} options
+   * @param {string} options.displayId - This display's unique hardware key
+   * @param {SyncConfig} options.syncConfig - Sync configuration from RegisterDisplay
+   * @param {Function} [options.onLayoutChange] - Called when lead requests layout change
+   * @param {Function} [options.onLayoutShow] - Called when lead gives show signal
+   * @param {Function} [options.onVideoStart] - Called when lead gives video start signal
+   */
+  constructor(options) {
+    this.displayId = options.displayId;
+    this.syncConfig = options.syncConfig;
+    this.isLead = options.syncConfig.isLead;
+    this.switchDelay = options.syncConfig.syncSwitchDelay || 750;
+    this.videoPauseDelay = options.syncConfig.syncVideoPauseDelay || 100;
+
+    // Callbacks
+    this.onLayoutChange = options.onLayoutChange || (() => {});
+    this.onLayoutShow = options.onLayoutShow || (() => {});
+    this.onVideoStart = options.onVideoStart || (() => {});
+
+    // State
+    this.channel = null;
+    this.followers = new Map();      // displayId → { lastSeen, ready }
+    this._heartbeatTimer = null;
+    this._cleanupTimer = null;
+    this._readyResolve = null;       // Resolve function for current ready-wait
+    this._pendingLayoutId = null;    // Layout we're waiting for readiness on
+    this._started = false;
+
+    // Log prefix for clarity in multi-tab console
+    this._tag = this.isLead ? '[Sync:LEAD]' : '[Sync:FOLLOW]';
+  }
+
+  /**
+   * Start the sync manager (opens BroadcastChannel, begins heartbeats)
+   */
+  start() {
+    if (this._started) return;
+    this._started = true;
+
+    if (typeof BroadcastChannel === 'undefined') {
+      console.warn(this._tag, 'BroadcastChannel not available — sync disabled');
+      return;
+    }
+
+    this.channel = new BroadcastChannel(CHANNEL_NAME);
+    this.channel.onmessage = (event) => this._handleMessage(event.data);
+
+    // Start heartbeat
+    this._heartbeatTimer = setInterval(() => this._sendHeartbeat(), HEARTBEAT_INTERVAL);
+    this._sendHeartbeat(); // Send initial heartbeat immediately
+
+    // Lead: periodically clean up stale followers
+    if (this.isLead) {
+      this._cleanupTimer = setInterval(() => this._cleanupStaleFollowers(), HEARTBEAT_INTERVAL);
+    }
+
+    console.log(this._tag, 'Started. DisplayId:', this.displayId);
+  }
+
+  /**
+   * Stop the sync manager
+   */
+  stop() {
+    if (!this._started) return;
+    this._started = false;
+
+    if (this._heartbeatTimer) {
+      clearInterval(this._heartbeatTimer);
+      this._heartbeatTimer = null;
+    }
+    if (this._cleanupTimer) {
+      clearInterval(this._cleanupTimer);
+      this._cleanupTimer = null;
+    }
+    if (this.channel) {
+      this.channel.close();
+      this.channel = null;
+    }
+
+    this.followers.clear();
+    console.log(this._tag, 'Stopped');
+  }
+
+  // ── Lead API ──────────────────────────────────────────────────────
+
+  /**
+   * [Lead only] Request all displays to change to a layout.
+   * Waits for followers to report ready, then sends show signal.
+   *
+   * @param {string|number} layoutId - Layout to change to
+   * @returns {Promise<void>} Resolves when show signal is sent
+   */
+  async requestLayoutChange(layoutId) {
+    if (!this.isLead) {
+      console.warn(this._tag, 'requestLayoutChange called on follower — ignoring');
+      return;
+    }
+
+    layoutId = String(layoutId);
+    this._pendingLayoutId = layoutId;
+
+    // Mark all followers as not-ready for this layout
+    for (const [, follower] of this.followers) {
+      follower.ready = false;
+      follower.readyLayoutId = null;
+    }
+
+    const showAt = Date.now() + this.switchDelay;
+
+    console.log(this._tag, `Requesting layout change: ${layoutId} (show at ${new Date(showAt).toISOString()}, ${this.followers.size} followers)`);
+
+    // Broadcast layout-change to all followers
+    this._send({
+      type: 'layout-change',
+      layoutId,
+      showAt,
+      displayId: this.displayId,
+    });
+
+    // Wait for all active followers to report ready (or timeout)
+    if (this.followers.size > 0) {
+      await this._waitForFollowersReady(layoutId);
+    }
+
+    // Apply switch delay (remaining time from showAt)
+    const remaining = showAt - Date.now();
+    if (remaining > 0) {
+      await new Promise(resolve => setTimeout(resolve, remaining));
+    }
+
+    // Send show signal
+    console.log(this._tag, `Sending layout-show: ${layoutId}`);
+    this._send({
+      type: 'layout-show',
+      layoutId,
+      displayId: this.displayId,
+    });
+
+    // Also trigger on self (lead shows too)
+    this.onLayoutShow(layoutId);
+
+    this._pendingLayoutId = null;
+  }
+
+  /**
+   * [Lead only] Signal followers to start video playback.
+   *
+   * @param {string|number} layoutId - Layout containing the video
+   * @param {string} regionId - Region with the video widget
+   */
+  async requestVideoStart(layoutId, regionId) {
+    if (!this.isLead) return;
+
+    // Wait videoPauseDelay before unpausing
+    await new Promise(resolve => setTimeout(resolve, this.videoPauseDelay));
+
+    this._send({
+      type: 'video-start',
+      layoutId: String(layoutId),
+      regionId,
+      displayId: this.displayId,
+    });
+
+    // Also trigger on self
+    this.onVideoStart(String(layoutId), regionId);
+  }
+
+  // ── Follower API ──────────────────────────────────────────────────
+
+  /**
+   * [Follower only] Report that layout is loaded and ready to show.
+   * Called by platform layer after layout content is prepared.
+   *
+   * @param {string|number} layoutId - Layout that is ready
+   */
+  reportReady(layoutId) {
+    layoutId = String(layoutId);
+
+    console.log(this._tag, `Reporting ready for layout ${layoutId}`);
+
+    this._send({
+      type: 'layout-ready',
+      layoutId,
+      displayId: this.displayId,
+    });
+  }
+
+  // ── Message handling ──────────────────────────────────────────────
+
+  /** @private */
+  _handleMessage(msg) {
+    // Ignore our own messages
+    if (msg.displayId === this.displayId) return;
+
+    switch (msg.type) {
+      case 'heartbeat':
+        this._handleHeartbeat(msg);
+        break;
+
+      case 'layout-change':
+        // Follower: lead is requesting a layout change
+        if (!this.isLead) {
+          console.log(this._tag, `Layout change requested: ${msg.layoutId}`);
+          this.onLayoutChange(msg.layoutId, msg.showAt);
+        }
+        break;
+
+      case 'layout-ready':
+        // Lead: follower reports ready
+        if (this.isLead) {
+          this._handleFollowerReady(msg);
+        }
+        break;
+
+      case 'layout-show':
+        // Follower: lead says show now
+        if (!this.isLead) {
+          console.log(this._tag, `Layout show signal: ${msg.layoutId}`);
+          this.onLayoutShow(msg.layoutId);
+        }
+        break;
+
+      case 'video-start':
+        // Follower: lead says start video
+        if (!this.isLead) {
+          console.log(this._tag, `Video start signal: ${msg.layoutId} region ${msg.regionId}`);
+          this.onVideoStart(msg.layoutId, msg.regionId);
+        }
+        break;
+
+      default:
+        console.warn(this._tag, 'Unknown message type:', msg.type);
+    }
+  }
+
+  /** @private */
+  _handleHeartbeat(msg) {
+    const existing = this.followers.get(msg.displayId);
+    if (existing) {
+      existing.lastSeen = Date.now();
+    } else {
+      // New follower discovered
+      this.followers.set(msg.displayId, {
+        lastSeen: Date.now(),
+        ready: false,
+        readyLayoutId: null,
+        role: msg.role || 'unknown',
+      });
+      console.log(this._tag, `Follower joined: ${msg.displayId} (${this.followers.size} total)`);
+    }
+  }
+
+  /** @private */
+  _handleFollowerReady(msg) {
+    const follower = this.followers.get(msg.displayId);
+    if (!follower) {
+      // Late joiner — register them
+      this.followers.set(msg.displayId, {
+        lastSeen: Date.now(),
+        ready: true,
+        readyLayoutId: msg.layoutId,
+      });
+    } else {
+      follower.ready = true;
+      follower.readyLayoutId = msg.layoutId;
+      follower.lastSeen = Date.now();
+    }
+
+    console.log(this._tag, `Follower ${msg.displayId} ready for layout ${msg.layoutId}`);
+
+    // Check if all followers are now ready
+    if (this._pendingLayoutId === msg.layoutId && this._readyResolve) {
+      if (this._allFollowersReady(msg.layoutId)) {
+        console.log(this._tag, 'All followers ready');
+        this._readyResolve();
+        this._readyResolve = null;
+      }
+    }
+  }
+
+  /** @private */
+  _allFollowersReady(layoutId) {
+    for (const [, follower] of this.followers) {
+      // Skip stale followers
+      if (Date.now() - follower.lastSeen > FOLLOWER_TIMEOUT) continue;
+      if (!follower.ready || follower.readyLayoutId !== layoutId) {
+        return false;
+      }
+    }
+    return true;
+  }
+
+  /** @private */
+  _waitForFollowersReady(layoutId) {
+    return new Promise((resolve) => {
+      // Already all ready?
+      if (this._allFollowersReady(layoutId)) {
+        resolve();
+        return;
+      }
+
+      this._readyResolve = resolve;
+
+      // Timeout: don't wait forever for unresponsive followers
+      setTimeout(() => {
+        if (this._readyResolve === resolve) {
+          const notReady = [];
+          for (const [id, f] of this.followers) {
+            if (!f.ready || f.readyLayoutId !== layoutId) {
+              notReady.push(id);
+            }
+          }
+          console.warn(this._tag, `Ready timeout — proceeding without: ${notReady.join(', ')}`);
+          this._readyResolve = null;
+          resolve();
+        }
+      }, READY_TIMEOUT);
+    });
+  }
+
+  // ── Heartbeat & cleanup ───────────────────────────────────────────
+
+  /** @private */
+  _sendHeartbeat() {
+    this._send({
+      type: 'heartbeat',
+      displayId: this.displayId,
+      role: this.isLead ? 'lead' : 'follower',
+      timestamp: Date.now(),
+    });
+  }
+
+  /** @private */
+  _cleanupStaleFollowers() {
+    const now = Date.now();
+    for (const [id, follower] of this.followers) {
+      if (now - follower.lastSeen > FOLLOWER_TIMEOUT) {
+        console.log(this._tag, `Removing stale follower: ${id} (last seen ${Math.round((now - follower.lastSeen) / 1000)}s ago)`);
+        this.followers.delete(id);
+      }
+    }
+  }
+
+  /** @private */
+  _send(msg) {
+    if (!this.channel) return;
+    try {
+      this.channel.postMessage(msg);
+    } catch (e) {
+      console.error(this._tag, 'Failed to send:', e);
+    }
+  }
+
+  // ── Status ────────────────────────────────────────────────────────
+
+  /**
+   * Get current sync status
+   * @returns {Object}
+   */
+  getStatus() {
+    return {
+      started: this._started,
+      isLead: this.isLead,
+      displayId: this.displayId,
+      followers: this.followers.size,
+      pendingLayoutId: this._pendingLayoutId,
+      followerDetails: Array.from(this.followers.entries()).map(([id, f]) => ({
+        displayId: id,
+        lastSeen: f.lastSeen,
+        ready: f.ready,
+        readyLayoutId: f.readyLayoutId,
+        stale: Date.now() - f.lastSeen > FOLLOWER_TIMEOUT,
+      })),
+    };
+  }
+}

package/src/sync-manager.test.js

@@ -0,0 +1,376 @@
+/**
+ * SyncManager unit tests
+ *
+ * Tests multi-display sync coordination via BroadcastChannel.
+ * Uses a simple BroadcastChannel mock for Node.js environment.
+ */
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest';
+import { SyncManager } from './sync-manager.js';
+
+// ── BroadcastChannel mock ──────────────────────────────────────────
+// Simulates same-origin message passing between instances
+
+const channels = new Map(); // channelName → Set<{onmessage}>
+
+class MockBroadcastChannel {
+  constructor(name) {
+    this.name = name;
+    this.onmessage = null;
+    this._closed = false;
+
+    if (!channels.has(name)) {
+      channels.set(name, new Set());
+    }
+    channels.get(name).add(this);
+  }
+
+  postMessage(data) {
+    if (this._closed) return;
+    const peers = channels.get(this.name);
+    if (!peers) return;
+
+    // Deliver to all OTHER instances on the same channel (not self)
+    for (const peer of peers) {
+      if (peer !== this && peer.onmessage && !peer._closed) {
+        // Clone data to simulate structured clone
+        peer.onmessage({ data: JSON.parse(JSON.stringify(data)) });
+      }
+    }
+  }
+
+  close() {
+    this._closed = true;
+    const peers = channels.get(this.name);
+    if (peers) {
+      peers.delete(this);
+      if (peers.size === 0) channels.delete(this.name);
+    }
+  }
+}
+
+// Install mock globally
+globalThis.BroadcastChannel = MockBroadcastChannel;
+
+// ── Helper to flush microtasks ──────────────────────────────────────
+const tick = (ms = 10) => new Promise(r => setTimeout(r, ms));
+
+describe('SyncManager', () => {
+  let lead;
+  let follower1;
+  let follower2;
+
+  const makeSyncConfig = (isLead) => ({
+    syncGroup: isLead ? 'lead' : '192.168.1.100',
+    syncPublisherPort: 9590,
+    syncSwitchDelay: 50, // Short delays for tests
+    syncVideoPauseDelay: 10,
+    isLead,
+  });
+
+  beforeEach(() => {
+    vi.useFakeTimers({ shouldAdvanceTime: true });
+    channels.clear();
+  });
+
+  afterEach(() => {
+    lead?.stop();
+    follower1?.stop();
+    follower2?.stop();
+    vi.useRealTimers();
+    channels.clear();
+  });
+
+  describe('Initialization', () => {
+    it('should create lead SyncManager', () => {
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+
+      expect(lead.isLead).toBe(true);
+      expect(lead.displayId).toBe('pwa-lead');
+    });
+
+    it('should create follower SyncManager', () => {
+      follower1 = new SyncManager({
+        displayId: 'pwa-follower1',
+        syncConfig: makeSyncConfig(false),
+      });
+
+      expect(follower1.isLead).toBe(false);
+    });
+
+    it('should start and open BroadcastChannel', () => {
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      lead.start();
+
+      expect(lead.channel).not.toBeNull();
+      expect(lead.getStatus().started).toBe(true);
+    });
+
+    it('should stop and close BroadcastChannel', () => {
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      lead.start();
+      lead.stop();
+
+      expect(lead.channel).toBeNull();
+      expect(lead.getStatus().started).toBe(false);
+    });
+  });
+
+  describe('Heartbeat', () => {
+    it('should discover followers via heartbeat', async () => {
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+      });
+
+      lead.start();
+      follower1.start();
+
+      // Initial heartbeat is sent on start()
+      await tick();
+
+      expect(lead.followers.size).toBe(1);
+      expect(lead.followers.has('pwa-f1')).toBe(true);
+    });
+
+    it('should discover multiple followers', async () => {
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+      });
+      follower2 = new SyncManager({
+        displayId: 'pwa-f2',
+        syncConfig: makeSyncConfig(false),
+      });
+
+      lead.start();
+      follower1.start();
+      follower2.start();
+
+      await tick();
+
+      expect(lead.followers.size).toBe(2);
+    });
+  });
+
+  describe('Layout Change Protocol', () => {
+    it('should send layout-change to followers', async () => {
+      const onLayoutChange = vi.fn();
+
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+        onLayoutChange,
+      });
+
+      lead.start();
+      follower1.start();
+      await tick();
+
+      // Lead requests layout change (don't await — follower will report ready)
+      const changePromise = lead.requestLayoutChange('100');
+
+      await tick();
+
+      // Follower should receive layout-change callback
+      expect(onLayoutChange).toHaveBeenCalledWith('100', expect.any(Number));
+
+      // Simulate follower reporting ready
+      follower1.reportReady('100');
+      await tick();
+
+      // Advance timers for switchDelay
+      vi.advanceTimersByTime(100);
+      await changePromise;
+    });
+
+    it('should call onLayoutShow on both lead and follower', async () => {
+      const leadOnShow = vi.fn();
+      const followerOnShow = vi.fn();
+
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+        onLayoutShow: leadOnShow,
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+        onLayoutShow: followerOnShow,
+        onLayoutChange: () => {
+          // Immediately report ready when layout change is requested
+          setTimeout(() => follower1.reportReady('100'), 5);
+        },
+      });
+
+      lead.start();
+      follower1.start();
+      await tick();
+
+      const changePromise = lead.requestLayoutChange('100');
+
+      // Wait for follower to process and report ready
+      vi.advanceTimersByTime(10);
+      await tick();
+
+      // Wait for switchDelay
+      vi.advanceTimersByTime(100);
+      await changePromise;
+
+      expect(leadOnShow).toHaveBeenCalledWith('100');
+      expect(followerOnShow).toHaveBeenCalledWith('100');
+    });
+
+    it('should proceed after timeout if follower is unresponsive', async () => {
+      const leadOnShow = vi.fn();
+
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+        onLayoutShow: leadOnShow,
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+        // Follower does NOT report ready (simulates unresponsive)
+        onLayoutChange: () => {},
+      });
+
+      lead.start();
+      follower1.start();
+      await tick();
+
+      const changePromise = lead.requestLayoutChange('200');
+
+      // Advance past ready timeout (10s) + switch delay
+      vi.advanceTimersByTime(11000);
+      await tick();
+      await changePromise;
+
+      // Lead should show anyway after timeout
+      expect(leadOnShow).toHaveBeenCalledWith('200');
+    });
+
+    it('should proceed immediately with no followers', async () => {
+      const leadOnShow = vi.fn();
+
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+        onLayoutShow: leadOnShow,
+      });
+
+      lead.start();
+      await tick();
+
+      const changePromise = lead.requestLayoutChange('300');
+
+      // Just switch delay, no follower waiting
+      vi.advanceTimersByTime(100);
+      await changePromise;
+
+      expect(leadOnShow).toHaveBeenCalledWith('300');
+    });
+  });
+
+  describe('Video Start', () => {
+    it('should send video-start signal to followers', async () => {
+      const onVideoStart = vi.fn();
+
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+        onVideoStart,
+      });
+
+      lead.start();
+      follower1.start();
+      await tick();
+
+      const videoPromise = lead.requestVideoStart('100', 'region-1');
+
+      // Wait for videoPauseDelay
+      vi.advanceTimersByTime(20);
+      await videoPromise;
+
+      expect(onVideoStart).toHaveBeenCalledWith('100', 'region-1');
+    });
+  });
+
+  describe('Status', () => {
+    it('should report accurate status', async () => {
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+      });
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+      });
+
+      lead.start();
+      follower1.start();
+      await tick();
+
+      const status = lead.getStatus();
+      expect(status.started).toBe(true);
+      expect(status.isLead).toBe(true);
+      expect(status.followers).toBe(1);
+      expect(status.followerDetails).toHaveLength(1);
+      expect(status.followerDetails[0].displayId).toBe('pwa-f1');
+    });
+  });
+
+  describe('Edge Cases', () => {
+    it('follower should not process requestLayoutChange', async () => {
+      follower1 = new SyncManager({
+        displayId: 'pwa-f1',
+        syncConfig: makeSyncConfig(false),
+      });
+      follower1.start();
+
+      // Should not throw, just warn and return
+      await follower1.requestLayoutChange('100');
+    });
+
+    it('should ignore own messages', async () => {
+      const onLayoutChange = vi.fn();
+
+      lead = new SyncManager({
+        displayId: 'pwa-lead',
+        syncConfig: makeSyncConfig(true),
+        onLayoutChange,
+      });
+
+      lead.start();
+      await tick();
+
+      // Lead should not receive its own heartbeat as a follower
+      expect(lead.followers.size).toBe(0);
+    });
+  });
+});