From 2a7de26996f999f0d6ca046db1f0287fa15a7890 Mon Sep 17 00:00:00 2001
From: golgetahir <tahir.golge@gmail.com>
Date: Mon, 16 Feb 2026 17:41:14 +0300
Subject: [PATCH 1/2] Implement auto managed compatibility with sdk v2

---
 packages/webrtc-sdk/src/client/base-client.ts |   2 +
 packages/webrtc-sdk/src/core/events.ts        |   8 +
 packages/webrtc-sdk/src/core/types.ts         |   6 +-
 packages/webrtc-sdk/src/core/webrtc-client.ts |   2 +
 .../webrtc-sdk/src/core/websocket-adaptor.ts  | 154 +++++++++++++++++-
 5 files changed, 165 insertions(+), 7 deletions(-)

diff --git a/packages/webrtc-sdk/src/client/base-client.ts b/packages/webrtc-sdk/src/client/base-client.ts
index e1591bf3..5f427ff5 100644
--- a/packages/webrtc-sdk/src/client/base-client.ts
+++ b/packages/webrtc-sdk/src/client/base-client.ts
@@ -141,6 +141,8 @@ export abstract class BaseClient extends Emitter<EventMap> {
       this.ws = new WebSocketAdaptor({
         websocketURL: opts.websocketURL,
         httpEndpointUrl: opts.httpEndpointUrl,
+        httpEndpointAccessToken: opts.httpEndpointAccessToken,
+        endpointTimeoutMs: opts.endpointTimeoutMs,
         webrtcadaptor: {
           notifyEventListeners: (info: string, obj?: unknown) =>
             this.handleTransportEvent(info, obj),
diff --git a/packages/webrtc-sdk/src/core/events.ts b/packages/webrtc-sdk/src/core/events.ts
index 956dab5c..bf95a0df 100644
--- a/packages/webrtc-sdk/src/core/events.ts
+++ b/packages/webrtc-sdk/src/core/events.ts
@@ -9,6 +9,14 @@ export interface EventMap {
   initialized: void;
   closed: unknown;
   server_will_stop: unknown;
+  /** Emitted when auto-managed endpoint resolution begins (Lambda call) */
+  endpoint_resolving: void;
+  /** Emitted when the Lambda returns instance info successfully */
+  endpoint_resolved: { websocketUrl: string; httpUrl: string };
+  /** Emitted while polling for the auto-managed instance to become ready */
+  instance_waiting: { attempt: number; elapsedMs: number };
+  /** Emitted when endpoint resolution or instance readiness times out */
+  endpoint_timeout: { elapsedMs: number; maxMs: number };
   /** Emitted when new local tracks are attached or replaced; used internally to refresh senders */
   publish_started: { streamId: string };
   publish_finished: { streamId: string };
diff --git a/packages/webrtc-sdk/src/core/types.ts b/packages/webrtc-sdk/src/core/types.ts
index a1b4815b..3db05d36 100644
--- a/packages/webrtc-sdk/src/core/types.ts
+++ b/packages/webrtc-sdk/src/core/types.ts
@@ -11,8 +11,12 @@ export type Role = "publisher" | "viewer";
 export interface BaseClientOptions {
   /** WebSocket signaling URL (e.g. wss://host:5443/App/websocket) */
   websocketURL?: string;
-  /** HTTP REST endpoint of Ant Media (used as fallback by signaling layer) */
+  /** HTTP endpoint URL (e.g. Lambda URL) that returns the websocket URL for auto-managed instances */
   httpEndpointUrl?: string;
+  /** Access token sent as a query parameter when resolving the HTTP endpoint */
+  httpEndpointAccessToken?: string;
+  /** Maximum time (ms) to wait for auto-managed endpoint resolution and instance readiness (default: 120000) */
+  endpointTimeoutMs?: number;
   /** If true, initializes in play-only mode and skips getUserMedia */
   isPlayMode?: boolean;
   /** If true, creates data-only sessions without capturing audio/video locally */
diff --git a/packages/webrtc-sdk/src/core/webrtc-client.ts b/packages/webrtc-sdk/src/core/webrtc-client.ts
index 208d6795..69ddc530 100644
--- a/packages/webrtc-sdk/src/core/webrtc-client.ts
+++ b/packages/webrtc-sdk/src/core/webrtc-client.ts
@@ -172,6 +172,8 @@ export class WebRTCClient extends Emitter<EventMap> {
       this.ws = new WebSocketAdaptor({
         websocketURL: opts.websocketURL,
         httpEndpointUrl: opts.httpEndpointUrl,
+        httpEndpointAccessToken: opts.httpEndpointAccessToken,
+        endpointTimeoutMs: opts.endpointTimeoutMs,
         webrtcadaptor: {
           notifyEventListeners: (info: string, obj?: unknown) =>
             this.notify(info as keyof EventMap, obj as never),
diff --git a/packages/webrtc-sdk/src/core/websocket-adaptor.ts b/packages/webrtc-sdk/src/core/websocket-adaptor.ts
index c84ac4d3..2ed22d07 100644
--- a/packages/webrtc-sdk/src/core/websocket-adaptor.ts
+++ b/packages/webrtc-sdk/src/core/websocket-adaptor.ts
@@ -18,14 +18,34 @@ export interface IWebSocketAdaptor {
  */
 export interface WebSocketAdaptorOptions {
   websocketURL?: string;
+  /** HTTP endpoint URL (e.g. Lambda URL) that returns the websocket URL for auto-managed instances */
   httpEndpointUrl?: string;
+  /** Access token sent as a query parameter when resolving the HTTP endpoint */
+  httpEndpointAccessToken?: string;
+  /** Maximum time (ms) to wait for endpoint resolution + instance readiness (default: 120000) */
+  endpointTimeoutMs?: number;
+  /** Interval (ms) between retry attempts when polling the endpoint or instance (default: 3000) */
+  endpointRetryMs?: number;
   webrtcadaptor: { notifyEventListeners: (info: string, obj?: unknown) => void };
   debug?: boolean | LogLevel;
 }
 
+/** Response shape returned by the auto-managed HTTP endpoint (Lambda). */
+interface EndpointResponse {
+  fqdn?: string;
+  websocket_url: string;
+  http_url: string;
+}
+
 /**
  * Thin wrapper around WebSocket that adapts Ant Media's signaling protocol
  * and emits typed events to the adaptor.
+ *
+ * Supports two connection modes:
+ * 1. **Direct WebSocket** — when `websocketURL` is provided, connects immediately.
+ * 2. **Auto-managed endpoint** — when `httpEndpointUrl` is provided, resolves the
+ *    actual WebSocket URL via the HTTP endpoint (e.g. AWS Lambda), polls until the
+ *    instance is ready, then connects.
  */
 export class WebSocketAdaptor extends Emitter<EventMap> implements IWebSocketAdaptor {
   private ws?: WebSocket;
@@ -34,6 +54,7 @@ export class WebSocketAdaptor extends Emitter<EventMap> implements IWebSocketAda
   private opts: WebSocketAdaptorOptions;
   private log: Logger;
   private pingTimer: ReturnType<typeof setInterval> | null = null;
+  private endpointAborted = false;
 
   /**
    * Create a new WebSocket adaptor.
@@ -44,11 +65,127 @@ export class WebSocketAdaptor extends Emitter<EventMap> implements IWebSocketAda
     this.log = new Logger(
       typeof opts.debug === "string" ? opts.debug : opts.debug ? "debug" : "info"
     );
-    if (opts.websocketURL || opts.httpEndpointUrl) {
-      this.init();
+    if (opts.websocketURL) {
+      this.initWebSocket(opts.websocketURL);
+    } else if (opts.httpEndpointUrl) {
+      void this.resolveEndpointAndConnect();
+    }
+  }
+
+  /**
+   * Resolves the actual WebSocket URL from the HTTP endpoint (Lambda) and waits
+   * for the backend instance to become ready before opening the WebSocket.
+   */
+  private async resolveEndpointAndConnect(): Promise<void> {
+    const maxWaitMs = this.opts.endpointTimeoutMs ?? 120_000;
+    const retryMs = this.opts.endpointRetryMs ?? 3000;
+    const startedAt = Date.now();
+    let attempt = 0;
+
+    this.connecting = true;
+    this.connected = false;
+
+    const endpointUrl = this.buildEndpointUrl();
+
+    while (!this.endpointAborted) {
+      const elapsedMs = Date.now() - startedAt;
+      if (elapsedMs >= maxWaitMs) {
+        this.connecting = false;
+        this.log.error("endpoint resolution timed out after %dms", elapsedMs);
+        this.opts.webrtcadaptor.notifyEventListeners("endpoint_timeout", {
+          elapsedMs,
+          maxMs: maxWaitMs,
+        });
+        this.opts.webrtcadaptor.notifyEventListeners("error", {
+          error: "EndpointTimeout",
+          message: `Auto-managed endpoint did not become ready within ${maxWaitMs}ms`,
+        });
+        return;
+      }
+
+      attempt++;
+
+      // Phase 1: Resolve endpoint
+      let data: EndpointResponse | null = null;
+      try {
+        this.opts.webrtcadaptor.notifyEventListeners("endpoint_resolving");
+        this.log.info("resolving endpoint (attempt %d): %s", attempt, endpointUrl);
+        const response = await fetch(endpointUrl, { method: "GET" });
+        if (!response.ok) {
+          throw new Error(`HTTP ${response.status} ${response.statusText}`);
+        }
+        data = (await response.json()) as EndpointResponse;
+        this.log.info(
+          "endpoint resolved -> fqdn: %s, websocket_url: %s, http_url: %s",
+          data.fqdn ?? "N/A",
+          data.websocket_url,
+          data.http_url
+        );
+        this.opts.webrtcadaptor.notifyEventListeners("endpoint_resolved", {
+          websocketUrl: data.websocket_url,
+          httpUrl: data.http_url,
+        });
+      } catch (e) {
+        this.log.warn(
+          "endpoint resolution failed (attempt %d), retrying in %dms",
+          attempt,
+          retryMs
+        );
+        this.log.debug("endpoint error:", e);
+        this.opts.webrtcadaptor.notifyEventListeners("instance_waiting", {
+          attempt,
+          elapsedMs: Date.now() - startedAt,
+        });
+        await this.delay(retryMs);
+        continue;
+      }
+
+      // Phase 2: Wait for instance readiness
+      if (this.endpointAborted) return;
+      try {
+        this.opts.webrtcadaptor.notifyEventListeners("instance_waiting", {
+          attempt,
+          elapsedMs: Date.now() - startedAt,
+        });
+        this.log.info("checking instance readiness: %s", data.http_url);
+        const healthResp = await fetch(data.http_url, { method: "HEAD" });
+        if (healthResp.status >= 200 && healthResp.status < 400) {
+          this.log.info("instance is ready, opening WebSocket");
+          this.initWebSocket(data.websocket_url);
+          return;
+        }
+        this.log.warn("instance not ready (HTTP %d), retrying in %dms", healthResp.status, retryMs);
+      } catch (e) {
+        this.log.warn(
+          "instance health check failed (attempt %d), retrying in %dms",
+          attempt,
+          retryMs
+        );
+        this.log.debug("health check error:", e);
+      }
+
+      await this.delay(retryMs);
+    }
+  }
+
+  /**
+   * Builds the endpoint URL with query parameters (source=sdk, optional accessToken).
+   */
+  private buildEndpointUrl(): string {
+    const url = new URL(this.opts.httpEndpointUrl!);
+    url.searchParams.set("source", "sdk");
+    if (this.opts.httpEndpointAccessToken) {
+      url.searchParams.set("accessToken", this.opts.httpEndpointAccessToken);
     }
+    return url.toString();
+  }
+
+  private delay(ms: number): Promise<void> {
+    return new Promise(resolve => setTimeout(resolve, ms));
   }
 
+  // ─── WebSocket connection ────────────────────────────────────────────
+
   private startPing(): void {
     this.clearPing();
     this.pingTimer = setInterval(() => {
@@ -63,12 +200,14 @@ export class WebSocketAdaptor extends Emitter<EventMap> implements IWebSocketAda
     }
   }
 
-  private init(): void {
-    if (!this.opts.websocketURL) return;
+  /**
+   * Opens a WebSocket connection to the given URL and wires up event handlers.
+   */
+  private initWebSocket(websocketURL: string): void {
     this.connecting = true;
     this.connected = false;
-    this.log.info("connecting to websocket %s", this.opts.websocketURL);
-    const ws = new WebSocket(this.opts.websocketURL);
+    this.log.info("connecting to websocket %s", websocketURL);
+    const ws = new WebSocket(websocketURL);
     this.ws = ws;
 
     ws.onopen = () => {
@@ -111,6 +250,8 @@ export class WebSocketAdaptor extends Emitter<EventMap> implements IWebSocketAda
     };
   }
 
+  // ─── Public API ──────────────────────────────────────────────────────
+
   isConnected(): boolean {
     return this.connected;
   }
@@ -136,6 +277,7 @@ export class WebSocketAdaptor extends Emitter<EventMap> implements IWebSocketAda
   }
 
   close(): void {
+    this.endpointAborted = true;
     this.clearPing();
     this.ws?.close();
   }

From f8f24eacb0328945896a2decf0ad54bde6fc1ac4 Mon Sep 17 00:00:00 2001
From: golgetahir <tahir.golge@gmail.com>
Date: Wed, 18 Feb 2026 13:04:06 +0300
Subject: [PATCH 2/2] Add conference auto managed example

---
 .../examples/conference-v2-auto-managed.html  | 811 ++++++++++++++++++
 packages/webrtc-sdk/src/client/base-client.ts |   1 +
 2 files changed, 812 insertions(+)
 create mode 100644 packages/webrtc-sdk/examples/conference-v2-auto-managed.html

diff --git a/packages/webrtc-sdk/examples/conference-v2-auto-managed.html b/packages/webrtc-sdk/examples/conference-v2-auto-managed.html
new file mode 100644
index 00000000..ef681913
--- /dev/null
+++ b/packages/webrtc-sdk/examples/conference-v2-auto-managed.html
@@ -0,0 +1,811 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>Ant Media WebRTC Conference – Auto-Managed (SDK v2)</title>
+    <script src="js/external/adapter-latest.js"></script>
+	<script src="js/external/jquery-3.7.1.min.js"></script>
+	<script src="js/external/notify.min.js" crossorigin="anonymous"></script>
+    <link rel="stylesheet" href="css/external//bootstrap4/bootstrap.min.css">
+    <link rel="stylesheet" href="css/common.css">
+    <style>
+      video {
+        width: 100%;
+        max-width: 320px;
+        height: 100%;
+        max-height: 240px;
+        background: #000;
+      }
+
+      body {
+        padding-top: 20px;
+        padding-bottom: 20px;
+      }
+
+      .options {
+        display: none;
+      }
+
+      .message-area {
+        height: 300px;
+        overflow-y: auto;
+        border-style: groove;
+        border-width: thin;
+        background-color: white;
+      }
+
+      #players {
+        position: relative;
+      }
+
+      .player-tile {
+        position: relative;
+        margin-bottom: 12px;
+      }
+
+      .player-overlay {
+        font-size: 10px;
+        position: absolute;
+        top: 5px;
+        left: 50%;
+        transform: translateX(-50%);
+        color: white;
+        background-color: rgba(0, 0, 0, 0.5);
+        padding: 5px;
+      }
+
+      #endpoint-status {
+        padding: 10px;
+        margin-bottom: 10px;
+        border-radius: 4px;
+        font-weight: bold;
+        display: none;
+      }
+      #endpoint-status.resolving {
+        display: block;
+        background-color: #fff3cd;
+        color: #856404;
+      }
+      #endpoint-status.waiting {
+        display: block;
+        background-color: #cce5ff;
+        color: #004085;
+      }
+      #endpoint-status.connected {
+        display: block;
+        background-color: #d4edda;
+        color: #155724;
+      }
+      #endpoint-status.error {
+        display: block;
+        background-color: #f8d7da;
+        color: #721c24;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="container">
+      <div class="header clearfix">
+        <div class="row">
+          <h3 class="col text-muted">WebRTC Multitrack Conference – Auto-Managed (SDK v2)</h3>
+          <nav class="col align-self-center">
+            <ul class="nav float-right">
+              <li><a href="http://antmedia.io">Contact</a></li>
+            </ul>
+          </nav>
+        </div>
+      </div>
+
+      <div class="jumbotron">
+        <div class="alert alert-primary text-center enterprise-feature" role="alert" style="margin-top:-2em">
+          WebRTC Conference is an enterprise edition feature.<br />
+          <a href="https://antmedia.io">Try Enterprise Edition for free at antmedia.io</a>
+        </div>
+
+        <div id="endpoint-status"></div>
+
+        <div id="players" class="row">
+          <div class="col-sm-3 player-tile" id="player-local">
+            <video id="localVideo" autoplay muted playsinline></video>
+            <div style="margin-top:10px;display:none" class="col-sm-8 col-sm-offset-2">
+              Microphone Gain:
+              <input type="range" id="volume_change_input" min="0" max="1" value="1" step="0.01" />
+            </div>
+          </div>
+        </div>
+
+        <div class="row" style="padding: 15px;">
+          <div class="col-sm-8 offset-sm-2">
+            <div style="padding:5px" class="form-check form-check-inline col-sm-10">
+              <input type="text" class="form-control" id="endpointUrl" placeholder="Lambda / HTTP Endpoint URL" />
+            </div>
+            <div style="padding:5px" class="form-check form-check-inline col-sm-10">
+              <input type="text" class="form-control" value="room1" id="roomName" placeholder="Type room name" />
+            </div>
+            <div style="padding:5px">
+              <button class="btn btn-info" id="connect_button">Connect</button>
+              <button class="btn btn-primary" disabled id="join_publish_button">Join Room</button>
+              <button class="btn btn-primary" disabled id="stop_publish_button">Leave Room</button>
+            </div>
+
+            <div class="badge badge-success" id="broadcastingInfo" style="font-size: 14px; display: none">
+              Publishing
+            </div>
+
+            <div class="col-sm-12 text-right">
+              <button type="button" id="options" class="btn btn-outline-primary btn-sm">Options</button>
+            </div>
+            <div class="form-group col-sm-12 text-left options">
+              <div style="padding:10px">
+                <button id="turn_off_camera_button" class="btn btn-outline-primary">Turn off Camera</button>
+                <button id="turn_on_camera_button" disabled class="btn btn-outline-primary">Turn on Camera</button>
+                <button id="mute_mic_button" class="btn btn-outline-primary">Mute Local Mic</button>
+                <button id="unmute_mic_button" disabled class="btn btn-outline-primary">Unmute Local Mic</button>
+              </div>
+
+              <label>Video Source</label>
+              <br />
+              <div class="form-check form-check-inline">
+                <input class="form-check-input video-source" disabled name="videoSource" type="radio" value="camera" id="camera_checkbox" checked />
+                <label class="form-check-label" for="camera_checkbox" style="font-weight:normal">Camera</label>
+              </div>
+              <div class="form-check form-check-inline">
+                <input class="form-check-input video-source" disabled name="videoSource" type="radio" value="screen" id="screen_share_checkbox" />
+                <label class="form-check-label" for="screen_share_checkbox" style="font-weight:normal">Screen</label>
+              </div>
+              <div class="form-check form-check-inline">
+                <input class="form-check-input video-source" disabled name="videoSource" type="radio" value="screen+camera" id="screen_share_with_camera_checkbox" />
+                <label class="form-check-label" for="screen_share_with_camera_checkbox" style="font-weight:normal">Screen with Camera</label>
+                <div class="form-check form-check-inline"></div>
+                <a id="browser_screen_share_doesnt_support" href="https://caniuse.com/#search=getDisplayMedia">Your browser doesn't support screen share. You can see supported browsers in this link</a>
+              </div>
+              <br />
+              <label>Data Channel Messages</label>
+              <div id="all-messages" class="message-area"></div>
+              <div class="form-row">
+                <div class="form-group col-sm-10">
+                  <input type="text" class="form-control" id="dataTextbox" placeholder="Write your message" />
+                </div>
+                <div class="form-group col-sm-2">
+                  <button type="button" id="send" class="btn btn-outline-primary btn-block">Send</button>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <footer class="footer">
+        <p>
+          <a href="http://antmedia.io">Ant Media Server Enterprise Edition</a>
+        </p>
+      </footer>
+    </div>
+
+    <script type="module">
+      import { ConferenceClient } from './js/index.js';
+      import { getUrlParameter } from "./js/fetch.stream.js"
+	  import { generateRandomString, errorHandler, updateBroadcastStatusInfo } from "./js/utility.js"
+
+      const Logger = window.log || console;
+
+      const volumeSlider = document.getElementById('volume_change_input');
+      const connectBtn = document.getElementById('connect_button');
+      const joinBtn = document.getElementById('join_publish_button');
+      const leaveBtn = document.getElementById('stop_publish_button');
+      const turnOffCamBtn = document.getElementById('turn_off_camera_button');
+      const turnOnCamBtn = document.getElementById('turn_on_camera_button');
+      const muteBtn = document.getElementById('mute_mic_button');
+      const unmuteBtn = document.getElementById('unmute_mic_button');
+      const optionsBtn = document.getElementById('options');
+      const sendBtn = document.getElementById('send');
+      const dataTextbox = document.getElementById('dataTextbox');
+      const messagesEl = document.getElementById('all-messages');
+      const playersEl = document.getElementById('players');
+      const broadcastingInfo = document.getElementById('broadcastingInfo');
+      const roomNameEl = document.getElementById('roomName');
+      const endpointUrlEl = document.getElementById('endpointUrl');
+      const endpointStatusEl = document.getElementById('endpoint-status');
+      const screenRadio = document.getElementById('screen_share_checkbox');
+      const cameraRadio = document.getElementById('camera_checkbox');
+      const screenCamRadio = document.getElementById('screen_share_with_camera_checkbox');
+      const browserScreenShareInfo = document.getElementById('browser_screen_share_doesnt_support');
+      const optionsPanel = document.querySelector('.options');
+
+      const token = getUrlParameter('token') || undefined;
+      let publishStreamId = getUrlParameter('streamId') || '';
+      let playOnly = getUrlParameter('playOnly') === 'true';
+      const dcOnly = getUrlParameter('dcOnly') === 'true';
+      const role = getUrlParameter('role') || undefined;
+      const roomIdFromUrl = getUrlParameter('roomId');
+      const streamNameFromUrl = getUrlParameter('streamName');
+      const subscriberId = getUrlParameter('subscriberId') || undefined;
+      const subscriberName = getUrlParameter('subscriberName') || undefined;
+      const subscriberCode = getUrlParameter('subscriberCode') || undefined;
+      const endpointFromUrl = getUrlParameter('httpEndpointUrl');
+      const accessTokenFromUrl = getUrlParameter('httpEndpointAccessToken') || undefined;
+
+      if (roomIdFromUrl) {
+        roomNameEl.value = roomIdFromUrl;
+      }
+      if (endpointFromUrl) {
+        endpointUrlEl.value = endpointFromUrl;
+      }
+
+      let client = null;
+      const participants = new Map();
+      let isCameraOff = false;
+      let isMicMuted = false;
+      let isDataChannelOpen = false;
+      let isPlayingRoom = false;
+
+      function log(msg, ...args) {
+        Logger.debug('[conference-auto]', msg, ...args);
+      }
+
+      function setEndpointStatus(text, cls) {
+        endpointStatusEl.textContent = text;
+        endpointStatusEl.className = cls;
+      }
+
+      function setJoinEnabled(flag) {
+        joinBtn.disabled = !flag;
+      }
+
+      function setLeaveEnabled(flag) {
+        leaveBtn.disabled = !flag;
+      }
+
+      function toggleOptions() {
+        if (!optionsPanel) return;
+        const isVisible = optionsPanel.style.display === 'block';
+        optionsPanel.style.display = isVisible ? 'none' : 'block';
+      }
+
+      function appendMessage(text) {
+        messagesEl.innerHTML += `${text}<br />`;
+        messagesEl.scrollTop = messagesEl.scrollHeight;
+      }
+
+      function handleCameraButtons() {
+        turnOffCamBtn.disabled = isCameraOff;
+        turnOnCamBtn.disabled = !isCameraOff;
+      }
+
+      function handleMicButtons() {
+        muteBtn.disabled = isMicMuted;
+        unmuteBtn.disabled = !isMicMuted;
+      }
+
+      function getUserMetadata() {
+        return {
+          isMicMuted,
+          isCameraOff
+        };
+      }
+
+      function updateMetadata() {
+        if (publishStreamId) {
+          client.updateStreamMetaData(publishStreamId, JSON.stringify(getUserMetadata()));
+        }
+      }
+
+      function createRemoteTile(streamId, kind) {
+        const existing = document.getElementById(`player-${streamId}`);
+        if (existing) return existing;
+        const col = document.createElement('div');
+        col.className = 'col-sm-3 player-tile';
+        col.id = `player-${streamId}`;
+        if (kind === 'audio') {
+          col.style.display = 'none';
+        }
+        col.innerHTML = `
+          <video id="remoteVideo-${streamId}" autoplay playsinline controls></video>
+          <div class="player-overlay" id="overlay-${streamId}">${streamId}</div>
+        `;
+        playersEl.appendChild(col);
+        return col;
+      }
+
+      function removeRemoteTile(streamId) {
+        const col = document.getElementById(`player-${streamId}`);
+        if (col) {
+          const video = col.querySelector('video');
+          if (video) {
+            const media = video.srcObject;
+            if (media) {
+              media.getTracks().forEach(t => t.stop());
+            }
+            video.srcObject = null;
+          }
+          playersEl.removeChild(col);
+        }
+      }
+
+      function removeAllRemoteTiles() {
+        [...playersEl.querySelectorAll('.player-tile')].forEach((tile) => {
+          if (tile.id === 'player-local') return;
+          playersEl.removeChild(tile);
+        });
+      }
+
+      function updateOverlay(streamId, text) {
+        const overlay = document.getElementById(`overlay-${streamId}`);
+        if (overlay) {
+          overlay.textContent = text;
+        }
+      }
+
+      // ─── Connect: create the ConferenceClient with httpEndpointUrl ───
+
+      function handleConnect() {
+        const httpEndpointUrl = endpointUrlEl.value.trim();
+        if (!httpEndpointUrl) {
+          appendMessage('HTTP Endpoint URL is required.');
+          return;
+        }
+
+        if (client) {
+          client.close();
+          client = null;
+        }
+
+        connectBtn.disabled = true;
+        setEndpointStatus('Connecting to auto-managed endpoint...', 'resolving');
+
+        client = new ConferenceClient({
+          httpEndpointUrl,
+          httpEndpointAccessToken: accessTokenFromUrl,
+          localVideo: document.getElementById('localVideo'),
+          isPlayMode: playOnly,
+          onlyDataChannel: dcOnly,
+          autoReconnect: true,
+          mediaConstraints: { video: !dcOnly ? { width: { min: 176, max: 360 } } : !dcOnly, audio: !dcOnly },
+          debug: true
+        });
+
+        window.conferenceClient = client;
+        wireClientEvents(client);
+      }
+
+      function wireClientEvents(client) {
+        // ─── Auto-managed endpoint events ──────────────────────────
+
+        client.on('endpoint_resolving', () => {
+          log('endpoint_resolving');
+          setEndpointStatus('Resolving endpoint (calling Lambda)...', 'resolving');
+        });
+
+        client.on('endpoint_resolved', ({ websocketUrl, httpUrl }) => {
+          log('endpoint_resolved', websocketUrl, httpUrl);
+          setEndpointStatus(`Instance found. Waiting for it to become ready...`, 'waiting');
+        });
+
+        client.on('instance_waiting', ({ attempt, elapsedMs }) => {
+          log('instance_waiting attempt=%d elapsed=%dms', attempt, elapsedMs);
+          const secs = Math.round(elapsedMs / 1000);
+          setEndpointStatus(`Waiting for instance to start... (${secs}s, attempt ${attempt})`, 'waiting');
+        });
+
+        client.on('endpoint_timeout', ({ elapsedMs, maxMs }) => {
+          log('endpoint_timeout elapsed=%dms max=%dms', elapsedMs, maxMs);
+          setEndpointStatus(`Timed out after ${Math.round(elapsedMs / 1000)}s. Instance did not become ready.`, 'error');
+          connectBtn.disabled = false;
+        });
+
+        // ─── Standard SDK events ───────────────────────────────────
+
+        client.on('initialized', () => {
+          log('initialized');
+          setEndpointStatus('Connected to instance.', 'connected');
+          setJoinEnabled(true);
+          setLeaveEnabled(false);
+          if (playOnly) {
+            isCameraOff = true;
+            handleCameraButtons();
+          }
+        });
+
+        client.on('browser_screen_share_supported', () => {
+          screenRadio.disabled = false;
+          cameraRadio.disabled = false;
+          screenCamRadio.disabled = false;
+          browserScreenShareInfo.style.display = 'none';
+        });
+
+        client.on('publish_started', ({ streamId }) => {
+          log('publish started', streamId);
+          setJoinEnabled(false);
+          setLeaveEnabled(true);
+          startBroadcastingAnimation();
+        });
+
+        client.on('play_started', ({ streamId }) => {
+          log('play started', streamId);
+          if (streamId === roomNameEl.value.trim()) {
+            isPlayingRoom = true;
+            client.getBroadcastObject(streamId);
+          }
+        });
+
+        client.on('play_finished', ({ streamId }) => {
+          log('play finished', streamId);
+          if (streamId === roomNameEl.value.trim()) {
+            isPlayingRoom = false;
+            removeAllRemoteTiles();
+          }
+        });
+
+        client.on('data_channel_opened', () => {
+          log('data channel opened');
+          isDataChannelOpen = true;
+        });
+
+        client.on('data_channel_closed', () => {
+          log('data channel closed');
+          isDataChannelOpen = false;
+        });
+
+        client.on('data_received', handleNotificationEvent);
+
+        client.on('newTrackAvailable', playVideo);
+
+        client.on('broadcast_object', handleBroadcastObject);
+
+        client.on('notification:videoTrackAssignmentList', handleNotificationEvent);
+
+        client.on('ice_connection_state_changed', ({ state, streamId }) => {
+          log('ICE state', state, streamId);
+          if (state === 'failed' || state === 'closed') {
+            client.getBroadcastObject(roomNameEl.value.trim());
+          }
+        });
+
+        client.on('reconnection_attempt_for_publisher', () => {
+          log('Reconnection attempt (publisher)');
+        });
+
+        client.on('reconnection_attempt_for_player', () => {
+          log('Reconnection attempt (player)');
+        });
+
+        client.on('session_restored', () => {
+          log('Session restored');
+          setJoinEnabled(false);
+          setLeaveEnabled(true);
+          startBroadcastingAnimation();
+        });
+
+        client.on('error', ({ error, message }) => {
+          appendMessage(`Error: ${message || error}`);
+          if (error === 'EndpointTimeout') {
+            connectBtn.disabled = false;
+          }
+        });
+      }
+
+      // ─── Join / Leave ──────────────────────────────────────────────
+
+      async function handleJoin() {
+        if (!client) {
+          appendMessage('Not connected. Press Connect first.');
+          return;
+        }
+
+        const roomId = roomNameEl.value.trim();
+        if (!roomId) {
+          appendMessage('Room name is required.');
+          return;
+        }
+
+        if (!publishStreamId) {
+          publishStreamId = generateRandomString(12);
+        }
+
+        const metadata = JSON.stringify(getUserMetadata());
+
+        try {
+          if (!playOnly) {
+            await client.publish({
+              streamId: publishStreamId,
+              roomId,
+              token,
+              subscriberId,
+              subscriberCode,
+              streamName: streamNameFromUrl || publishStreamId,
+              metaData: metadata,
+              role
+            });
+          }
+
+          await client.play({
+            streamId: roomId,
+            roomId,
+            token,
+            subscriberId,
+            subscriberCode,
+            subscriberName,
+            role,
+            disableTracksByDefault: false,
+            userPublishId: publishStreamId
+          });
+
+          setJoinEnabled(false);
+          setLeaveEnabled(true);
+          toggleVideoSourceControls(true);
+        } catch (err) {
+          appendMessage(`Join failed: ${err?.message || err?.error || err}`);
+          log('Join failed', err);
+        }
+      }
+
+      function toggleVideoSourceControls(enabled) {
+        for (const radio of document.querySelectorAll('input[name="videoSource"]')) {
+          radio.disabled = !enabled;
+        }
+      }
+
+      function handleLeave() {
+        const roomId = roomNameEl.value.trim();
+        removeAllRemoteTiles();
+        participants.clear();
+        setJoinEnabled(true);
+        setLeaveEnabled(false);
+        toggleVideoSourceControls(false);
+        broadcastingInfo.style.display = 'none';
+        if (publishStreamId) {
+          client.stop(publishStreamId);
+        }
+        if (roomId) {
+          client.stop(roomId);
+        }
+        isPlayingRoom = false;
+      }
+
+      // ─── Data channel ──────────────────────────────────────────────
+
+      async function handleSendData() {
+        const message = dataTextbox.value.trim();
+        if (!message) return;
+        const payload = { streamId: publishStreamId, eventType: 'CHAT_MESSAGE', message };
+        try {
+          if (isDataChannelOpen && publishStreamId) {
+            await client.sendJSON(publishStreamId, payload);
+          } else if (isDataChannelOpen) {
+            await client.sendJSON(roomNameEl.value.trim(), payload);
+          } else {
+            appendMessage('Data channel is not open.');
+            return;
+          }
+          appendMessage(`Sent: ${message}`);
+          dataTextbox.value = '';
+        } catch (err) {
+          appendMessage(`Send failed: ${err?.message || err?.error || err}`);
+        }
+      }
+
+      // ─── Video source switching ────────────────────────────────────
+
+      async function switchVideoMode(mode) {
+        try {
+          if (mode === 'screen') {
+            await client.startScreenShare();
+          } else if (mode === 'screen+camera') {
+            await client.startScreenWithCameraOverlay();
+          } else {
+            await client.stopScreenShare();
+            await client.turnOnLocalCamera();
+          }
+        } catch (err) {
+          appendMessage(`Switch video failed: ${err?.message || err?.error || err}`);
+          cameraRadio.checked = true;
+        }
+      }
+
+      async function turnOffCamera() {
+        try {
+          await client.turnOffLocalCamera();
+          isCameraOff = true;
+          handleCameraButtons();
+          sendNotificationEvent('CAM_TURNED_OFF');
+          updateMetadata();
+        } catch (err) {
+          appendMessage('Turn off camera failed.');
+        }
+      }
+
+      async function turnOnCamera() {
+        try {
+          await client.turnOnLocalCamera();
+          isCameraOff = false;
+          handleCameraButtons();
+          sendNotificationEvent('CAM_TURNED_ON');
+          updateMetadata();
+        } catch (err) {
+          appendMessage('Turn on camera failed.');
+        }
+      }
+
+      function muteMic() {
+        client.muteLocalMic();
+        isMicMuted = true;
+        handleMicButtons();
+        sendNotificationEvent('MIC_MUTED');
+        updateMetadata();
+      }
+
+      function unmuteMic() {
+        client.unmuteLocalMic();
+        isMicMuted = false;
+        handleMicButtons();
+        sendNotificationEvent('MIC_UNMUTED');
+        updateMetadata();
+      }
+
+      function sendNotificationEvent(eventType) {
+        if (!isDataChannelOpen) {
+          log('Data channel closed; cannot send notification');
+          return;
+        }
+        const payload = { streamId: publishStreamId, eventType };
+        try {
+          if (publishStreamId) {
+            client.sendJSON(publishStreamId, payload);
+          }
+        } catch (err) {
+          log('Notification send failed', err);
+        }
+      }
+
+      // ─── Broadcast / track helpers ─────────────────────────────────
+
+      function handleBroadcastObject(obj) {
+        const broadcastObject = typeof obj.broadcast === 'string' ? JSON.parse(obj.broadcast) : obj.broadcast;
+        if (!broadcastObject) return;
+        if (obj.streamId === roomNameEl.value.trim()) {
+          handleRoomBroadcastObject(broadcastObject);
+        } else {
+          handleParticipantBroadcastObject(broadcastObject);
+        }
+      }
+
+      function handleRoomBroadcastObject(broadcastObject) {
+        const list = broadcastObject.subTrackStreamIds || [];
+        for (const [streamId, info] of participants.entries()) {
+          if (!info.isFake && !list.includes(streamId)) {
+            log('Removing participant', streamId);
+            participants.delete(streamId);
+            removeRemoteTile(streamId);
+          }
+        }
+        list.forEach(id => {
+          if (!participants.has(id)) {
+            client.getBroadcastObject(id);
+          }
+        });
+      }
+
+      function handleParticipantBroadcastObject(broadcastObject) {
+        const streamId = broadcastObject.streamId;
+        if (!streamId) return;
+        if (broadcastObject.metaData) {
+          try {
+            const meta = JSON.parse(broadcastObject.metaData);
+            broadcastObject.isCameraOff = meta.isCameraOff;
+            broadcastObject.isMicMuted = meta.isMicMuted;
+          } catch (e) {
+            log('Metadata parse failed', e);
+          }
+        }
+        participants.set(streamId, broadcastObject);
+        updateOverlay(streamId, `${streamId}${broadcastObject.isMicMuted ? ' (muted)' : ''}`);
+      }
+
+      function handleNotificationEvent(data) {
+        const payload = typeof data.data === 'string' ? JSON.parse(data.data) : data.data;
+        if (!payload || typeof payload !== 'object') {
+          log('Unknown data payload', payload);
+          return;
+        }
+        const { eventType, message, streamId } = payload;
+        switch (eventType) {
+          case 'CHAT_MESSAGE':
+            appendMessage(`Received: ${message}`);
+            break;
+          case 'CAM_TURNED_OFF':
+          case 'CAM_TURNED_ON':
+          case 'MIC_MUTED':
+          case 'MIC_UNMUTED':
+          case 'TRACK_LIST_UPDATED':
+            client.getBroadcastObject(roomNameEl.value.trim());
+            break;
+          case 'VIDEO_TRACK_ASSIGNMENT_LIST':
+            if (payload.payload) {
+              payload.payload.forEach(item => {
+                var overlay = document.getElementById("overlay-" + item.videoLabel);
+                if (overlay != null) {
+                  overlay.innerHTML = item.videoLabel + "->" + item.trackId;
+                }
+              });
+            }
+            break;
+          default:
+            log('Notification event', eventType, payload);
+            break;
+        }
+      }
+
+      function playVideo(obj) {
+        var roomId = roomNameEl.value.trim();
+
+        var incomingTrackId = obj.trackId.substring("ARDAMSx".length);
+
+        if (incomingTrackId == roomId || incomingTrackId == publishStreamId) {
+          return;
+        }
+
+        var video = document.getElementById("remoteVideo-" + incomingTrackId);
+
+        if (video == null) {
+          createRemoteTile(incomingTrackId, obj.track.kind);
+          video = document.getElementById("remoteVideo-" + incomingTrackId);
+          video.srcObject = new MediaStream();
+        }
+
+        video.srcObject.addTrack(obj.track);
+
+        obj.track.onended = event => {
+          console.log("track is ended with id: " + event.target.id);
+        };
+
+        obj.stream.onremovetrack = event => {
+          console.log("track is removed with id: " + event.track.id);
+          var removedTrackId = event.track.id.substring("ARDAMSx".length);
+          removeRemoteTile(removedTrackId);
+        };
+      }
+
+      function startBroadcastingAnimation() {
+        broadcastingInfo.style.display = 'inline-block';
+        broadcastingInfo.style.opacity = '1';
+        broadcastingInfo.animate(
+          [{ opacity: 1 }, { opacity: 0 }],
+          { duration: 1600, iterations: Infinity }
+        );
+      }
+
+      // ─── Event listeners ───────────────────────────────────────────
+
+      volumeSlider.addEventListener('input', () => {
+        if (client) client.setVolumeLevel(parseFloat(volumeSlider.value));
+      });
+
+      connectBtn.addEventListener('click', handleConnect);
+      joinBtn.addEventListener('click', handleJoin);
+      leaveBtn.addEventListener('click', handleLeave);
+      optionsBtn.addEventListener('click', toggleOptions);
+      sendBtn.addEventListener('click', handleSendData);
+      dataTextbox.addEventListener('keyup', e => {
+        if (e.key === 'Enter') handleSendData();
+      });
+      turnOffCamBtn.addEventListener('click', () => { void turnOffCamera(); });
+      turnOnCamBtn.addEventListener('click', () => { void turnOnCamera(); });
+      muteBtn.addEventListener('click', muteMic);
+      unmuteBtn.addEventListener('click', unmuteMic);
+
+      document.querySelectorAll('input[name="videoSource"]').forEach(radio => {
+        radio.addEventListener('change', e => {
+          if (e.target.checked) {
+            void switchVideoMode(e.target.value);
+          }
+        });
+      });
+
+      // Auto-connect if endpoint URL is provided via URL parameter
+      if (endpointFromUrl) {
+        handleConnect();
+      }
+    </script>
+  </body>
+</html>
diff --git a/packages/webrtc-sdk/src/client/base-client.ts b/packages/webrtc-sdk/src/client/base-client.ts
index 5f427ff5..129da565 100644
--- a/packages/webrtc-sdk/src/client/base-client.ts
+++ b/packages/webrtc-sdk/src/client/base-client.ts
@@ -898,6 +898,7 @@ export abstract class BaseClient extends Emitter<EventMap> {
       }
 
       this.onInitialized();
+      this.emit("initialized", undefined as never);
       return;
     } else if (info === "start") {
       const { streamId } = obj as { streamId: string };