fix: echo in firefox versions >= 116

100mslive · Jan 15, 2024 · e61f613 · e61f613
1 parent 4141fa5
commit e61f613
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/packages/hms-video-store/src/media/tracks/HMSAudioTrack.ts b/packages/hms-video-store/src/media/tracks/HMSAudioTrack.ts
@@ -1,6 +1,7 @@
 import { HMSTrack, HMSTrackSource } from './HMSTrack';
 import { HMSTrackType } from './HMSTrackType';
 import HMSLogger from '../../utils/logger';
+import { isFirefox } from '../../utils/support';
 import { HMSMediaStream, HMSRemoteStream } from '../streams';
 
 export class HMSAudioTrack extends HMSTrack {
@@ -69,8 +70,19 @@ export class HMSAudioTrack extends HMSTrack {
     try {
       // @ts-ignore
       if (typeof this.audioElement.setSinkId === 'function') {
-        // @ts-ignore
-        await this.audioElement?.setSinkId(device.deviceId);
+        if (isFirefox) {
+          // using setSinkId in firefox disables echo cancellation (introduced in Firefox 116)
+          // todo: GoogleMeet doesn't set sinkId for all 3 audio elements, how do they redirect audio then?
+          //
+          // refer: https://100ms.atlassian.net/browse/LIVE-1992
+          // refer: https://bugzilla.mozilla.org/show_bug.cgi?id=1849108
+          // refer: https://bugzilla.mozilla.org/show_bug.cgi?id=1848283
+          // refer: https://github.com/aws/amazon-chime-sdk-js/issues/2742
+        } else {
+          // @ts-ignore
+          await this.audioElement?.setSinkId(device.deviceId);
+        }
+
         this.outputDevice = device;
       }
     } catch (error) {

diff --git a/packages/hms-video-store/src/utils/support.ts b/packages/hms-video-store/src/utils/support.ts
@@ -28,3 +28,5 @@ export const isMobile = () => parsedUserAgent.getDevice().type === 'mobile';
 export const isPageHidden = () => typeof document !== 'undefined' && document.hidden;
 
 export const isIOS = () => parsedUserAgent.getOS().name?.toLowerCase() === 'ios';
+
+export const isFirefox = parsedUserAgent.getBrowser()?.name?.toLowerCase() === 'firefox';
Original file line number	Diff line number	Diff line change
Expand Up		@@ -28,3 +28,5 @@ export const isMobile = () => parsedUserAgent.getDevice().type === 'mobile';
		export const isPageHidden = () => typeof document !== 'undefined' && document.hidden;

		export const isIOS = () => parsedUserAgent.getOS().name?.toLowerCase() === 'ios';

		export const isFirefox = parsedUserAgent.getBrowser()?.name?.toLowerCase() === 'firefox';