@stream-io/video-client 0.3.21 → 0.3.23

package/dist/version.d.ts

@@ -1 +1 @@
-export declare const version = "0.3.21";
+export declare const version = "0.3.23";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stream-io/video-client",
-  "version": "0.3.21",
+  "version": "0.3.23",
   "packageManager": "yarn@3.2.4",
   "main": "dist/index.cjs.js",
   "module": "dist/index.es.js",
@@ -48,7 +48,6 @@
     "@rollup/plugin-replace": "^5.0.2",
     "@rollup/plugin-typescript": "^11.1.2",
     "@types/jsonwebtoken": "^9.0.1",
-    "@types/rimraf": "^3.0.2",
     "@types/sdp-transform": "^2.4.6",
     "@types/ua-parser-js": "^0.7.36",
     "@types/ws": "^8.5.4",
@@ -56,7 +55,7 @@
     "dotenv": "^16.3.1",
     "happy-dom": "^11.0.2",
     "prettier": "^2.8.4",
-    "rimraf": "^3.0.2",
+    "rimraf": "^5.0.1",
     "rollup": "^3.28.1",
     "typescript": "^4.9.5",
     "vite": "^4.4.9",

package/src/helpers/DynascaleManager.ts

@@ -22,6 +22,7 @@ import {
 import { ViewportTracker } from './ViewportTracker';
 import { getLogger } from '../logger';
 import { getSdkInfo } from '../client-details';
+import { isFirefox, isSafari } from './browsers';
 
 const DEFAULT_VIEWPORT_VISIBILITY_STATE: Record<
   VideoTrackType,
@@ -274,6 +275,14 @@ export class DynascaleManager {
             }
           });
 
+    videoElement.autoplay = true;
+    videoElement.playsInline = true;
+
+    // explicitly marking the element as muted will allow autoplay to work
+    // without prior user interaction:
+    // https://developer.mozilla.org/en-US/docs/Web/Media/Autoplay_guide
+    videoElement.muted = true;
+
     const streamSubscription = participant$
       .pipe(
         distinctUntilKeyChanged(
@@ -284,22 +293,19 @@ export class DynascaleManager {
         const source =
           trackType === 'videoTrack' ? p.videoStream : p.screenShareStream;
         if (videoElement.srcObject === source) return;
-        setTimeout(() => {
-          videoElement.srcObject = source ?? null;
-          if (videoElement.srcObject) {
+        videoElement.srcObject = source ?? null;
+        if (isSafari() || isFirefox()) {
+          setTimeout(() => {
+            videoElement.srcObject = source ?? null;
             videoElement.play().catch((e) => {
               this.logger('warn', `Failed to play stream`, e);
             });
-          }
-        }, 0);
+            // we add extra delay until we attempt to force-play
+            // the participant's media stream in Firefox and Safari,
+            // as they seem to have some timing issues
+          }, 25);
+        }
       });
-    videoElement.playsInline = true;
-    videoElement.autoplay = true;
-
-    // explicitly marking the element as muted will allow autoplay to work
-    // without prior user interaction:
-    // https://developer.mozilla.org/en-US/docs/Web/Media/Autoplay_guide
-    videoElement.muted = true;
 
     return () => {
       requestTrackWithDimensions(DebounceType.FAST, undefined);
@@ -359,7 +365,8 @@ export class DynascaleManager {
         getSdkInfo()?.type === SdkType.REACT
           ? p?.audioOutputDeviceId
           : selectedDevice;
-      if ('setSinkId' in audioElement) {
+
+      if ('setSinkId' in audioElement && typeof deviceId === 'string') {
         // @ts-expect-error setSinkId is not yet in the lib
         audioElement.setSinkId(deviceId);
       }