@stream-io/video-client 1.6.3 → 1.6.5

package/CHANGELOG.md

@@ -2,6 +2,20 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [1.6.5](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-1.6.4...@stream-io/video-client-1.6.5) (2024-09-19)
+
+
+### Bug Fixes
+
+* race condition in `applySettingsToStream` ([#1489](https://github.com/GetStream/stream-video-js/issues/1489)) ([bf2ad90](https://github.com/GetStream/stream-video-js/commit/bf2ad90224d88592d4ea27ea8d0683efe98771f7))
+
+## [1.6.4](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-1.6.3...@stream-io/video-client-1.6.4) (2024-09-13)
+
+
+### Bug Fixes
+
+* allow video target bitrate override ([#1487](https://github.com/GetStream/stream-video-js/issues/1487)) ([bfe34a3](https://github.com/GetStream/stream-video-js/commit/bfe34a3609182da5bbb03331978d86569cada098))
+
 ## [1.6.3](https://github.com/GetStream/stream-video-js/compare/@stream-io/video-client-1.6.2...@stream-io/video-client-1.6.3) (2024-09-11)
 
 

package/dist/index.browser.es.js

@@ -4,9 +4,9 @@ import { ServiceType, stackIntercept, RpcError } from '@protobuf-ts/runtime-rpc'
 import axios, { AxiosHeaders } from 'axios';
 export { AxiosError } from 'axios';
 import { TwirpFetchTransport, TwirpErrorCode } from '@protobuf-ts/twirp-transport';
+import { UAParser } from 'ua-parser-js';
 import { ReplaySubject, combineLatest, BehaviorSubject, map as map$1, shareReplay, distinctUntilChanged, takeWhile, distinctUntilKeyChanged, fromEventPattern, startWith, concatMap, merge, from, fromEvent, debounceTime, pairwise, of, debounce, timer } from 'rxjs';
 import * as SDP from 'sdp-transform';
-import { UAParser } from 'ua-parser-js';
 import WebSocket$1 from 'isomorphic-ws';
 import { fromByteArray } from 'base64-js';
 
@@ -6820,6 +6820,72 @@ const retryable = async (rpc, signal) => {
     return result;
 };
 
+const version = "1.6.5" ;
+const [major, minor, patch] = version.split('.');
+let sdkInfo = {
+    type: SdkType.PLAIN_JAVASCRIPT,
+    major,
+    minor,
+    patch,
+};
+let osInfo;
+let deviceInfo;
+let webRtcInfo;
+const setSdkInfo = (info) => {
+    sdkInfo = info;
+};
+const getSdkInfo = () => {
+    return sdkInfo;
+};
+const setOSInfo = (info) => {
+    osInfo = info;
+};
+const getOSInfo = () => {
+    return osInfo;
+};
+const setDeviceInfo = (info) => {
+    deviceInfo = info;
+};
+const getDeviceInfo = () => {
+    return deviceInfo;
+};
+const getWebRTCInfo = () => {
+    return webRtcInfo;
+};
+const setWebRTCInfo = (info) => {
+    webRtcInfo = info;
+};
+const getClientDetails = () => {
+    if (isReactNative()) {
+        // Since RN doesn't support web, sharing browser info is not required
+        return {
+            sdk: getSdkInfo(),
+            os: getOSInfo(),
+            device: getDeviceInfo(),
+        };
+    }
+    const userAgent = new UAParser(navigator.userAgent);
+    const { browser, os, device, cpu } = userAgent.getResult();
+    return {
+        sdk: getSdkInfo(),
+        browser: {
+            name: browser.name || navigator.userAgent,
+            version: browser.version || '',
+        },
+        os: {
+            name: os.name || '',
+            version: os.version || '',
+            architecture: cpu.architecture || '',
+        },
+        device: {
+            name: [device.vendor, device.model, device.type]
+                .filter(Boolean)
+                .join(' '),
+            version: '',
+        },
+    };
+};
+
 /**
  * Returns back a list of sorted codecs, with the preferred codec first.
  *
@@ -6894,6 +6960,20 @@ const getGenericSdp = async (direction) => {
     tempPc.close();
     return sdp;
 };
+/**
+ * Returns the optimal codec for RN.
+ */
+const getRNOptimalCodec = () => {
+    const osName = getOSInfo()?.name.toLowerCase();
+    // in ipads it was noticed that if vp8 codec is used
+    // then the bytes sent is 0 in the outbound-rtp
+    // so we are forcing h264 codec for ipads
+    if (osName === 'ipados')
+        return 'h264';
+    if (osName === 'android')
+        return 'vp8';
+    return undefined;
+};
 
 const sfuEventKinds = {
     subscriberOffer: undefined,
@@ -7017,12 +7097,13 @@ const defaultBitratePerRid = {
  *
  * @param videoTrack the video track to find optimal layers for.
  * @param targetResolution the expected target resolution.
+ * @param preferredBitrate the preferred bitrate for the video track.
  */
-const findOptimalVideoLayers = (videoTrack, targetResolution = defaultTargetResolution) => {
+const findOptimalVideoLayers = (videoTrack, targetResolution = defaultTargetResolution, preferredBitrate) => {
     const optimalVideoLayers = [];
     const settings = videoTrack.getSettings();
     const { width: w = 0, height: h = 0 } = settings;
-    const maxBitrate = getComputedMaxBitrate(targetResolution, w, h);
+    const maxBitrate = getComputedMaxBitrate(targetResolution, w, h, preferredBitrate);
     let downscaleFactor = 1;
     ['f', 'h', 'q'].forEach((rid) => {
         // Reversing the order [f, h, q] to [q, h, f] as Chrome uses encoding index
@@ -7053,18 +7134,20 @@ const findOptimalVideoLayers = (videoTrack, targetResolution = defaultTargetReso
  * @param targetResolution the target resolution.
  * @param currentWidth the current width of the track.
  * @param currentHeight the current height of the track.
+ * @param preferredBitrate the preferred bitrate for the track.
  */
-const getComputedMaxBitrate = (targetResolution, currentWidth, currentHeight) => {
+const getComputedMaxBitrate = (targetResolution, currentWidth, currentHeight, preferredBitrate) => {
     // if the current resolution is lower than the target resolution,
     // we want to proportionally reduce the target bitrate
-    const { width: targetWidth, height: targetHeight } = targetResolution;
+    const { width: targetWidth, height: targetHeight, bitrate: targetBitrate, } = targetResolution;
+    const bitrate = preferredBitrate || targetBitrate;
     if (currentWidth < targetWidth || currentHeight < targetHeight) {
         const currentPixels = currentWidth * currentHeight;
         const targetPixels = targetWidth * targetHeight;
         const reductionFactor = currentPixels / targetPixels;
-        return Math.round(targetResolution.bitrate * reductionFactor);
+        return Math.round(bitrate * reductionFactor);
     }
-    return targetResolution.bitrate;
+    return bitrate;
 };
 /**
  * Browsers have different simulcast constraints for different video resolutions.
@@ -8748,72 +8831,6 @@ const enableHighQualityAudio = (sdp, trackMid, maxBitrate = 510000) => {
     return SDP.write(parsedSdp);
 };
 
-const version = "1.6.3" ;
-const [major, minor, patch] = version.split('.');
-let sdkInfo = {
-    type: SdkType.PLAIN_JAVASCRIPT,
-    major,
-    minor,
-    patch,
-};
-let osInfo;
-let deviceInfo;
-let webRtcInfo;
-const setSdkInfo = (info) => {
-    sdkInfo = info;
-};
-const getSdkInfo = () => {
-    return sdkInfo;
-};
-const setOSInfo = (info) => {
-    osInfo = info;
-};
-const getOSInfo = () => {
-    return osInfo;
-};
-const setDeviceInfo = (info) => {
-    deviceInfo = info;
-};
-const getDeviceInfo = () => {
-    return deviceInfo;
-};
-const getWebRTCInfo = () => {
-    return webRtcInfo;
-};
-const setWebRTCInfo = (info) => {
-    webRtcInfo = info;
-};
-const getClientDetails = () => {
-    if (isReactNative()) {
-        // Since RN doesn't support web, sharing browser info is not required
-        return {
-            sdk: getSdkInfo(),
-            os: getOSInfo(),
-            device: getDeviceInfo(),
-        };
-    }
-    const userAgent = new UAParser(navigator.userAgent);
-    const { browser, os, device, cpu } = userAgent.getResult();
-    return {
-        sdk: getSdkInfo(),
-        browser: {
-            name: browser.name || navigator.userAgent,
-            version: browser.version || '',
-        },
-        os: {
-            name: os.name || '',
-            version: os.version || '',
-            architecture: cpu.architecture || '',
-        },
-        device: {
-            name: [device.vendor, device.model, device.type]
-                .filter(Boolean)
-                .join(' '),
-            version: '',
-        },
-    };
-};
-
 /**
  * The `Publisher` is responsible for publishing/unpublishing media streams to/from the SFU
  *
@@ -8942,24 +8959,12 @@ class Publisher {
                 const targetResolution = settings?.video
                     .target_resolution;
                 const screenShareBitrate = settings?.screensharing.target_resolution?.bitrate;
+                const { preferredBitrate, preferredCodec, screenShareSettings } = opts;
                 const videoEncodings = trackType === TrackType.VIDEO
-                    ? findOptimalVideoLayers(track, targetResolution)
+                    ? findOptimalVideoLayers(track, targetResolution, preferredBitrate)
                     : trackType === TrackType.SCREEN_SHARE
-                        ? findOptimalScreenSharingLayers(track, opts.screenShareSettings, screenShareBitrate)
+                        ? findOptimalScreenSharingLayers(track, screenShareSettings, screenShareBitrate)
                         : undefined;
-                let preferredCodec = opts.preferredCodec;
-                if (!preferredCodec && trackType === TrackType.VIDEO && isReactNative()) {
-                    const osName = getOSInfo()?.name.toLowerCase();
-                    if (osName === 'ipados') {
-                        // in ipads it was noticed that if vp8 codec is used
-                        // then the bytes sent is 0 in the outbound-rtp
-                        // so we are forcing h264 codec for ipads
-                        preferredCodec = 'H264';
-                    }
-                    else if (osName === 'android') {
-                        preferredCodec = 'VP8';
-                    }
-                }
                 // listen for 'ended' event on the track as it might be ended abruptly
                 // by an external factor as permission revokes, device disconnected, etc.
                 // keep in mind that `track.stop()` doesn't trigger this event.
@@ -8978,8 +8983,11 @@ class Publisher {
                 this.transceiverInitOrder.push(trackType);
                 this.transceiverRegistry[trackType] = transceiver;
                 this.publishOptionsPerTrackType.set(trackType, opts);
+                const codec = isReactNative() && trackType === TrackType.VIDEO && !preferredCodec
+                    ? getRNOptimalCodec()
+                    : preferredCodec;
                 const codecPreferences = 'setCodecPreferences' in transceiver
-                    ? this.getCodecPreferences(trackType, preferredCodec)
+                    ? this.getCodecPreferences(trackType, codec)
                     : undefined;
                 if (codecPreferences) {
                     this.logger('info', `Setting ${TrackType[trackType]} codec preferences`, codecPreferences);
@@ -9293,7 +9301,7 @@ class Publisher {
                     const publishOpts = this.publishOptionsPerTrackType.get(trackType);
                     optimalLayers =
                         trackType === TrackType.VIDEO
-                            ? findOptimalVideoLayers(track, targetResolution)
+                            ? findOptimalVideoLayers(track, targetResolution, publishOpts?.preferredBitrate)
                             : trackType === TrackType.SCREEN_SHARE
                                 ? findOptimalScreenSharingLayers(track, publishOpts?.screenShareSettings)
                                 : [];
@@ -11761,10 +11769,12 @@ class InputMediaDeviceManager {
         await this.applySettingsToStream();
     }
     async applySettingsToStream() {
-        if (this.enabled) {
-            await this.muteStream();
-            await this.unmuteStream();
-        }
+        await withCancellation(this.statusChangeConcurrencyTag, async () => {
+            if (this.enabled) {
+                await this.muteStream();
+                await this.unmuteStream();
+            }
+        });
     }
     getTracks() {
         return this.state.mediaStream?.getTracks() ?? [];
@@ -11907,17 +11917,19 @@ class InputMediaDeviceManager {
         }
         if (this.state.mediaStream !== stream) {
             this.state.setMediaStream(stream, await rootStream);
+            const handleTrackEnded = async () => {
+                await this.statusChangeSettled();
+                if (this.enabled) {
+                    this.isTrackStoppedDueToTrackEnd = true;
+                    setTimeout(() => {
+                        this.isTrackStoppedDueToTrackEnd = false;
+                    }, 2000);
+                    await this.disable();
+                }
+            };
             this.getTracks().forEach((track) => {
-                track.addEventListener('ended', async () => {
-                    await this.statusChangeSettled();
-                    if (this.enabled) {
-                        this.isTrackStoppedDueToTrackEnd = true;
-                        setTimeout(() => {
-                            this.isTrackStoppedDueToTrackEnd = false;
-                        }, 2000);
-                        await this.disable();
-                    }
-                });
+                track.addEventListener('ended', handleTrackEnded);
+                this.subscriptions.push(() => track.removeEventListener('ended', handleTrackEnded));
             });
         }
     }
@@ -12167,6 +12179,17 @@ class CameraManager extends InputMediaDeviceManager {
             height: 720,
         };
     }
+    /**
+     * The publish options for the camera.
+     *
+     * @internal internal use only, not part of the public API.
+     */
+    get publishOptions() {
+        return {
+            preferredCodec: this.preferredCodec,
+            preferredBitrate: this.preferredBitrate,
+        };
+    }
     /**
      * Select the camera direction.
      *
@@ -12223,6 +12246,15 @@ class CameraManager extends InputMediaDeviceManager {
     setPreferredCodec(codec) {
         this.preferredCodec = codec;
     }
+    /**
+     * Sets the preferred bitrate for encoding the video.
+     *
+     * @internal internal use only, not part of the public API.
+     * @param bitrate the bitrate to use for encoding the video.
+     */
+    setPreferredBitrate(bitrate) {
+        this.preferredBitrate = bitrate;
+    }
     getDevices() {
         return getVideoDevices();
     }
@@ -12238,9 +12270,7 @@ class CameraManager extends InputMediaDeviceManager {
         return getVideoStream(constraints);
     }
     publishStream(stream) {
-        return this.call.publishVideoStream(stream, {
-            preferredCodec: this.preferredCodec,
-        });
+        return this.call.publishVideoStream(stream, this.publishOptions);
     }
     stopPublishStream(stopTracks) {
         return this.call.stopPublish(TrackType.VIDEO, stopTracks);
@@ -13633,9 +13663,7 @@ class Call {
                     case TrackType.VIDEO:
                         const videoStream = this.camera.state.mediaStream;
                         if (videoStream) {
-                            await this.publishVideoStream(videoStream, {
-                                preferredCodec: this.camera.preferredCodec,
-                            });
+                            await this.publishVideoStream(videoStream, this.camera.publishOptions);
                         }
                         break;
                     case TrackType.SCREEN_SHARE:
@@ -14311,9 +14339,7 @@ class Call {
                 if (this.camera.enabled &&
                     this.camera.state.mediaStream &&
                     !this.publisher?.isPublishing(TrackType.VIDEO)) {
-                    await this.publishVideoStream(this.camera.state.mediaStream, {
-                        preferredCodec: this.camera.preferredCodec,
-                    });
+                    await this.publishVideoStream(this.camera.state.mediaStream, this.camera.publishOptions);
                 }
                 // Start camera if backend config specifies, and there is no local setting
                 if (this.camera.state.status === undefined &&
@@ -16092,7 +16118,7 @@ class StreamClient {
             });
         };
         this.getUserAgent = () => {
-            const version = "1.6.3" ;
+            const version = "1.6.5" ;
             return (this.userAgent ||
                 `stream-video-javascript-client-${this.node ? 'node' : 'browser'}-${version}`);
         };