@stream-io/video-client 0.0.1-alpha.83 → 0.0.1-alpha.85

package/dist/index.browser.es.js

@@ -2,7 +2,6 @@ import 'webrtc-adapter';
 import { MessageType, isJsonObject, typeofJsonValue, reflectionMergePartial, UnknownFieldHandler, WireType, MESSAGE_TYPE, PbLong } from '@protobuf-ts/runtime';
 import { TwirpFetchTransport } from '@protobuf-ts/twirp-transport';
 import { ServiceType, stackIntercept } from '@protobuf-ts/runtime-rpc';
-import { v4 } from 'uuid';
 import { ReplaySubject, BehaviorSubject, Subject, takeWhile, debounceTime, startWith, pairwise, Observable, concatMap, from, shareReplay, merge, map as map$2, combineLatest, filter, firstValueFrom } from 'rxjs';
 import { take, combineLatestWith, map as map$1, distinctUntilChanged } from 'rxjs/operators';
 import axios, { AxiosHeaders } from 'axios';
@@ -3798,6 +3797,7 @@ class SignalServerClient {
 const defaultOptions = {
     baseUrl: '',
     sendJson: true,
+    timeout: 5 * 1000,
     jsonOptions: {
         ignoreUnknownFields: true,
     },
@@ -3866,6 +3866,129 @@ class IceTrickleBuffer {
     }
 }
 
+const sleep = (m) => new Promise((r) => setTimeout(r, m));
+function isFunction(value) {
+    return (value &&
+        (Object.prototype.toString.call(value) === '[object Function]' ||
+            'function' === typeof value ||
+            value instanceof Function));
+}
+// todo: rename so that it does not contain word "chat"
+const chatCodes = {
+    TOKEN_EXPIRED: 40,
+    WS_CLOSED_SUCCESS: 1000,
+};
+/**
+ * retryInterval - A retry interval which increases acc to number of failures
+ *
+ * @return {number} Duration to wait in milliseconds
+ */
+function retryInterval(numberOfFailures) {
+    // try to reconnect in 0.25-5 seconds (random to spread out the load from failures)
+    const max = Math.min(500 + numberOfFailures * 2000, 5000);
+    const min = Math.min(Math.max(250, (numberOfFailures - 1) * 2000), 5000);
+    return Math.floor(Math.random() * (max - min) + min);
+}
+function randomId() {
+    return generateUUIDv4();
+}
+function hex(bytes) {
+    let s = '';
+    for (let i = 0; i < bytes.length; i++) {
+        s += bytes[i].toString(16).padStart(2, '0');
+    }
+    return s;
+}
+// https://tools.ietf.org/html/rfc4122
+function generateUUIDv4() {
+    const bytes = getRandomBytes(16);
+    bytes[6] = (bytes[6] & 0x0f) | 0x40; // version
+    bytes[8] = (bytes[8] & 0xbf) | 0x80; // variant
+    return (hex(bytes.subarray(0, 4)) +
+        '-' +
+        hex(bytes.subarray(4, 6)) +
+        '-' +
+        hex(bytes.subarray(6, 8)) +
+        '-' +
+        hex(bytes.subarray(8, 10)) +
+        '-' +
+        hex(bytes.subarray(10, 16)));
+}
+function getRandomValuesWithMathRandom(bytes) {
+    const max = Math.pow(2, (8 * bytes.byteLength) / bytes.length);
+    for (let i = 0; i < bytes.length; i++) {
+        bytes[i] = Math.random() * max;
+    }
+}
+const getRandomValues = (() => {
+    if (typeof crypto !== 'undefined' &&
+        typeof (crypto === null || crypto === void 0 ? void 0 : crypto.getRandomValues) !== 'undefined') {
+        return crypto.getRandomValues.bind(crypto);
+    }
+    else if (typeof msCrypto !== 'undefined') {
+        return msCrypto.getRandomValues.bind(msCrypto);
+    }
+    else {
+        return getRandomValuesWithMathRandom;
+    }
+})();
+function getRandomBytes(length) {
+    const bytes = new Uint8Array(length);
+    getRandomValues(bytes);
+    return bytes;
+}
+function convertErrorToJson(err) {
+    const jsonObj = {};
+    if (!err)
+        return jsonObj;
+    try {
+        Object.getOwnPropertyNames(err).forEach((key) => {
+            jsonObj[key] = Object.getOwnPropertyDescriptor(err, key);
+        });
+    }
+    catch (_) {
+        return {
+            error: 'failed to serialize the error',
+        };
+    }
+    return jsonObj;
+}
+/**
+ * isOnline safely return the navigator.online value for browser env
+ * if navigator is not in global object, it always return true
+ */
+function isOnline() {
+    const nav = typeof navigator !== 'undefined'
+        ? navigator
+        : typeof window !== 'undefined' && window.navigator
+            ? window.navigator
+            : undefined;
+    if (!nav) {
+        console.warn('isOnline failed to access window.navigator and assume browser is online');
+        return true;
+    }
+    // RN navigator has undefined for onLine
+    if (typeof nav.onLine !== 'boolean') {
+        return true;
+    }
+    return nav.onLine;
+}
+/**
+ * listenForConnectionChanges - Adds an event listener fired on browser going online or offline
+ */
+function addConnectionEventListeners(cb) {
+    if (typeof window !== 'undefined' && window.addEventListener) {
+        window.addEventListener('offline', cb);
+        window.addEventListener('online', cb);
+    }
+}
+function removeConnectionEventListeners(cb) {
+    if (typeof window !== 'undefined' && window.removeEventListener) {
+        window.removeEventListener('offline', cb);
+        window.removeEventListener('online', cb);
+    }
+}
+
 const hostnameFromUrl = (url) => {
     try {
         const u = new URL(url);
@@ -3894,6 +4017,13 @@ const toURL = (url) => {
  * The client used for exchanging information with the SFU.
  */
 class StreamSfuClient {
+    /**
+     * Constructs a new SFU client.
+     *
+     * @param dispatcher the event dispatcher to use.
+     * @param url the URL of the SFU.
+     * @param token the JWT token to use for authentication.
+     */
     constructor(dispatcher, url, token) {
         /**
          * A buffer for ICE Candidates that are received before
@@ -3909,19 +4039,19 @@ class StreamSfuClient {
             clearTimeout(this.connectionCheckTimeout);
         };
         this.updateSubscriptions = (subscriptions) => __awaiter(this, void 0, void 0, function* () {
-            return this.rpc.updateSubscriptions({
+            return retryable(() => this.rpc.updateSubscriptions({
                 sessionId: this.sessionId,
                 tracks: subscriptions,
-            });
+            }));
         });
         this.setPublisher = (data) => __awaiter(this, void 0, void 0, function* () {
-            return this.rpc.setPublisher(Object.assign(Object.assign({}, data), { sessionId: this.sessionId }));
+            return retryable(() => this.rpc.setPublisher(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
         });
         this.sendAnswer = (data) => __awaiter(this, void 0, void 0, function* () {
-            return this.rpc.sendAnswer(Object.assign(Object.assign({}, data), { sessionId: this.sessionId }));
+            return retryable(() => this.rpc.sendAnswer(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
         });
         this.iceTrickle = (data) => __awaiter(this, void 0, void 0, function* () {
-            return this.rpc.iceTrickle(Object.assign(Object.assign({}, data), { sessionId: this.sessionId }));
+            return retryable(() => this.rpc.iceTrickle(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
         });
         this.updateMuteState = (trackType, muted) => __awaiter(this, void 0, void 0, function* () {
             return this.updateMuteStates({
@@ -3934,7 +4064,7 @@ class StreamSfuClient {
             });
         });
         this.updateMuteStates = (data) => __awaiter(this, void 0, void 0, function* () {
-            return this.rpc.updateMuteStates(Object.assign(Object.assign({}, data), { sessionId: this.sessionId }));
+            return retryable(() => this.rpc.updateMuteStates(Object.assign(Object.assign({}, data), { sessionId: this.sessionId })));
         });
         this.join = (data) => __awaiter(this, void 0, void 0, function* () {
             const joinRequest = JoinRequest.create(Object.assign(Object.assign({}, data), { sessionId: this.sessionId, token: this.token }));
@@ -3979,7 +4109,7 @@ class StreamSfuClient {
                 }
             }, this.unhealthyTimeoutInMs);
         };
-        this.sessionId = v4();
+        this.sessionId = generateUUIDv4();
         this.token = token;
         this.rpc = createSignalClient({
             baseUrl: url,
@@ -4027,6 +4157,37 @@ class StreamSfuClient {
         });
     }
 }
+const MAX_RETRIES = 5;
+/**
+ * Creates a closure which wraps the given RPC call and retries invoking
+ * the RPC until it succeeds or the maximum number of retries is reached.
+ *
+ * Between each retry, there would be a random delay in order to avoid
+ * request bursts towards the SFU.
+ *
+ * @param rpc the closure around the RPC call to execute.
+ * @param <I> the type of the request object.
+ * @param <O> the type of the response object.
+ */
+const retryable = (rpc) => __awaiter(void 0, void 0, void 0, function* () {
+    var _a;
+    let retryAttempt = 0;
+    let rpcCallResult;
+    do {
+        // don't delay the first invocation
+        if (retryAttempt > 0) {
+            yield sleep(retryInterval(retryAttempt));
+        }
+        rpcCallResult = yield rpc();
+        // if the RPC call failed, log the error and retry
+        if (rpcCallResult.response.error) {
+            console.error('SFU Error:', rpcCallResult.response.error);
+        }
+        retryAttempt++;
+    } while (((_a = rpcCallResult.response.error) === null || _a === void 0 ? void 0 : _a.shouldRetry) &&
+        retryAttempt < MAX_RETRIES);
+    return rpcCallResult;
+});
 
 function getIceCandidate(candidate) {
     if (!candidate.usernameFragment) {
@@ -5727,129 +5888,6 @@ const CallTypes = new CallTypesRegistry([
     }),
 ]);
 
-const sleep = (m) => new Promise((r) => setTimeout(r, m));
-function isFunction(value) {
-    return (value &&
-        (Object.prototype.toString.call(value) === '[object Function]' ||
-            'function' === typeof value ||
-            value instanceof Function));
-}
-// todo: rename so that it does not contain word "chat"
-const chatCodes = {
-    TOKEN_EXPIRED: 40,
-    WS_CLOSED_SUCCESS: 1000,
-};
-/**
- * retryInterval - A retry interval which increases acc to number of failures
- *
- * @return {number} Duration to wait in milliseconds
- */
-function retryInterval(numberOfFailures) {
-    // try to reconnect in 0.25-5 seconds (random to spread out the load from failures)
-    const max = Math.min(500 + numberOfFailures * 2000, 5000);
-    const min = Math.min(Math.max(250, (numberOfFailures - 1) * 2000), 5000);
-    return Math.floor(Math.random() * (max - min) + min);
-}
-function randomId() {
-    return generateUUIDv4();
-}
-function hex(bytes) {
-    let s = '';
-    for (let i = 0; i < bytes.length; i++) {
-        s += bytes[i].toString(16).padStart(2, '0');
-    }
-    return s;
-}
-// https://tools.ietf.org/html/rfc4122
-function generateUUIDv4() {
-    const bytes = getRandomBytes(16);
-    bytes[6] = (bytes[6] & 0x0f) | 0x40; // version
-    bytes[8] = (bytes[8] & 0xbf) | 0x80; // variant
-    return (hex(bytes.subarray(0, 4)) +
-        '-' +
-        hex(bytes.subarray(4, 6)) +
-        '-' +
-        hex(bytes.subarray(6, 8)) +
-        '-' +
-        hex(bytes.subarray(8, 10)) +
-        '-' +
-        hex(bytes.subarray(10, 16)));
-}
-function getRandomValuesWithMathRandom(bytes) {
-    const max = Math.pow(2, (8 * bytes.byteLength) / bytes.length);
-    for (let i = 0; i < bytes.length; i++) {
-        bytes[i] = Math.random() * max;
-    }
-}
-const getRandomValues = (() => {
-    if (typeof crypto !== 'undefined' &&
-        typeof (crypto === null || crypto === void 0 ? void 0 : crypto.getRandomValues) !== 'undefined') {
-        return crypto.getRandomValues.bind(crypto);
-    }
-    else if (typeof msCrypto !== 'undefined') {
-        return msCrypto.getRandomValues.bind(msCrypto);
-    }
-    else {
-        return getRandomValuesWithMathRandom;
-    }
-})();
-function getRandomBytes(length) {
-    const bytes = new Uint8Array(length);
-    getRandomValues(bytes);
-    return bytes;
-}
-function convertErrorToJson(err) {
-    const jsonObj = {};
-    if (!err)
-        return jsonObj;
-    try {
-        Object.getOwnPropertyNames(err).forEach((key) => {
-            jsonObj[key] = Object.getOwnPropertyDescriptor(err, key);
-        });
-    }
-    catch (_) {
-        return {
-            error: 'failed to serialize the error',
-        };
-    }
-    return jsonObj;
-}
-/**
- * isOnline safely return the navigator.online value for browser env
- * if navigator is not in global object, it always return true
- */
-function isOnline() {
-    const nav = typeof navigator !== 'undefined'
-        ? navigator
-        : typeof window !== 'undefined' && window.navigator
-            ? window.navigator
-            : undefined;
-    if (!nav) {
-        console.warn('isOnline failed to access window.navigator and assume browser is online');
-        return true;
-    }
-    // RN navigator has undefined for onLine
-    if (typeof nav.onLine !== 'boolean') {
-        return true;
-    }
-    return nav.onLine;
-}
-/**
- * listenForConnectionChanges - Adds an event listener fired on browser going online or offline
- */
-function addConnectionEventListeners(cb) {
-    if (typeof window !== 'undefined' && window.addEventListener) {
-        window.addEventListener('offline', cb);
-        window.addEventListener('online', cb);
-    }
-}
-function removeConnectionEventListeners(cb) {
-    if (typeof window !== 'undefined' && window.removeEventListener) {
-        window.removeEventListener('offline', cb);
-        window.removeEventListener('online', cb);
-    }
-}
-
 const UPDATE_SUBSCRIPTIONS_DEBOUNCE_DURATION = 600;
 /**
  * A `Call` object represents the active call the user is part of.
@@ -5887,6 +5925,13 @@ class Call {
         this.dispatcher = new Dispatcher();
         this.trackSubscriptionsSubject = new Subject();
         this.reconnectAttempts = 0;
+        this.maxReconnectAttempts = 10;
+        /**
+         * A list hooks/functions to invoke when the call is left.
+         * A typical use case is to clean up some global event handlers.
+         * @private
+         */
+        this.leaveCallHooks = [];
         /**
          * Remove subscription for WebSocket events that were created by the `on` method.
          * @param eventName
@@ -5913,6 +5958,8 @@ class Call {
             (_d = this.sfuClient) === null || _d === void 0 ? void 0 : _d.close();
             this.sfuClient = undefined;
             this.dispatcher.offAll();
+            // Call all leave call hooks, e.g. to clean up global event handlers
+            this.leaveCallHooks.forEach((hook) => hook());
             this.clientStore.setCurrentValue(this.clientStore.activeCallSubject, undefined);
             this.state.setCurrentValue(this.state.callingStateSubject, CallingState.LEFT);
         };
@@ -6004,12 +6051,15 @@ class Call {
                     // do nothing if the connection was closed on purpose
                     if (e.code === 1000)
                         return;
-                    if (this.reconnectAttempts >= 10) {
-                        console.log('Reconnect attempts exceeded. Giving up...');
-                        this.state.setCurrentValue(this.state.callingStateSubject, CallingState.RECONNECTING_FAILED);
+                    if (this.reconnectAttempts < this.maxReconnectAttempts) {
+                        rejoin().catch(() => {
+                            console.log(`Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
+                            this.state.setCurrentValue(this.state.callingStateSubject, CallingState.RECONNECTING_FAILED);
+                        });
                     }
                     else {
-                        void rejoin();
+                        console.log('Reconnect attempts exceeded. Giving up...');
+                        this.state.setCurrentValue(this.state.callingStateSubject, CallingState.RECONNECTING_FAILED);
                     }
                 });
             });
@@ -6026,11 +6076,16 @@ class Call {
                     if (this.state.getCurrentValue(this.state.callingState$) ===
                         CallingState.OFFLINE) {
                         console.log('Join: Going online...');
-                        rejoin();
+                        rejoin().catch(() => {
+                            console.log(`Rejoin failed for ${this.reconnectAttempts} times. Giving up.`);
+                            this.state.setCurrentValue(this.state.callingStateSubject, CallingState.RECONNECTING_FAILED);
+                        });
                     }
                 };
                 window.addEventListener('offline', handleOnOffline);
                 window.addEventListener('online', handleOnOnline);
+                // register cleanup hooks
+                this.leaveCallHooks.push(() => window.removeEventListener('offline', handleOnOffline), () => window.removeEventListener('online', handleOnOnline));
             }
             this.subscriber = createSubscriber({
                 rpcClient: sfuClient,
@@ -6088,7 +6143,7 @@ class Call {
             }
             catch (err) {
                 // join failed, try to rejoin
-                if (this.reconnectAttempts < 10) {
+                if (this.reconnectAttempts < this.maxReconnectAttempts) {
                     yield rejoin();
                     console.log(`Rejoin ${this.reconnectAttempts} successful!`);
                 }
@@ -6234,12 +6289,10 @@ class Call {
          * @param trackType the track type to stop publishing.
          */
         this.stopPublish = (trackType) => __awaiter(this, void 0, void 0, function* () {
-            if (!this.publisher) {
-                throw new Error(`Call not joined yet.`);
-            }
+            var _f;
             console.log(`stopPublish`, TrackType[trackType]);
-            const wasPublishing = this.publisher.unpublishStream(trackType);
-            if (wasPublishing) {
+            const wasPublishing = (_f = this.publisher) === null || _f === void 0 ? void 0 : _f.unpublishStream(trackType);
+            if (wasPublishing && this.sfuClient) {
                 yield this.sfuClient.updateMuteState(trackType, true);
                 const audioOrVideoOrScreenShareStream = trackTypeToParticipantStreamKey(trackType);
                 if (audioOrVideoOrScreenShareStream) {
@@ -6316,8 +6369,8 @@ class Call {
          * @returns
          */
         this.getStats = (kind, selector) => __awaiter(this, void 0, void 0, function* () {
-            var _f;
-            return (_f = this.statsReporter) === null || _f === void 0 ? void 0 : _f.getRawStatsForTrack(kind, selector);
+            var _g;
+            return (_g = this.statsReporter) === null || _g === void 0 ? void 0 : _g.getRawStatsForTrack(kind, selector);
         });
         /**
          * Will enhance the reported stats with additional participant-specific information (`callStatsReport$` state [store variable](./StreamVideoClient.md/#readonlystatestore)).
@@ -6405,8 +6458,8 @@ class Call {
          * @returns
          */
         this.updatePublishQuality = (enabledRids) => __awaiter(this, void 0, void 0, function* () {
-            var _g;
-            return (_g = this.publisher) === null || _g === void 0 ? void 0 : _g.updateVideoPublishQuality(enabledRids);
+            var _h;
+            return (_h = this.publisher) === null || _h === void 0 ? void 0 : _h.updateVideoPublishQuality(enabledRids);
         });
         this.handleOnTrack = (e) => {
             const [primaryStream] = e.streams;
@@ -8728,7 +8781,7 @@ class StreamClient {
     }
     getUserAgent() {
         return (this.userAgent ||
-            `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${"0.0.1-alpha.82"}`);
+            `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${"0.0.1-alpha.84"}`);
     }
     setUserAgent(userAgent) {
         this.userAgent = userAgent;