Fix media switching during legacy calls (#5069)

* Specify exact for deviceId

* Update mediaHandler.spec.ts

* fallback to ideal if exact fails

* Reduce cognitive complexity for sonar

* Add tests

Author: langleyd

spec/unit/webrtc/mediaHandler.spec.ts

@@ -61,10 +61,10 @@ describe("Media Handler", function () {
         expect(mockMediaDevices.getUserMedia).toHaveBeenCalledWith(
             expect.objectContaining({
                 audio: expect.objectContaining({
-                    deviceId: { ideal: FAKE_AUDIO_INPUT_ID },
+                    deviceId: { exact: FAKE_AUDIO_INPUT_ID },
                 }),
                 video: expect.objectContaining({
-                    deviceId: { ideal: FAKE_VIDEO_INPUT_ID },
+                    deviceId: { exact: FAKE_VIDEO_INPUT_ID },
                 }),
             }),
         );
@@ -77,7 +77,7 @@ describe("Media Handler", function () {
         expect(mockMediaDevices.getUserMedia).toHaveBeenCalledWith(
             expect.objectContaining({
                 audio: expect.objectContaining({
-                    deviceId: { ideal: FAKE_AUDIO_INPUT_ID },
+                    deviceId: { exact: FAKE_AUDIO_INPUT_ID },
                 }),
             }),
         );
@@ -109,7 +109,7 @@ describe("Media Handler", function () {
         expect(mockMediaDevices.getUserMedia).toHaveBeenCalledWith(
             expect.objectContaining({
                 video: expect.objectContaining({
-                    deviceId: { ideal: FAKE_VIDEO_INPUT_ID },
+                    deviceId: { exact: FAKE_VIDEO_INPUT_ID },
                 }),
             }),
         );
@@ -122,10 +122,10 @@ describe("Media Handler", function () {
         expect(mockMediaDevices.getUserMedia).toHaveBeenCalledWith(
             expect.objectContaining({
                 audio: expect.objectContaining({
-                    deviceId: { ideal: FAKE_AUDIO_INPUT_ID },
+                    deviceId: { exact: FAKE_AUDIO_INPUT_ID },
                 }),
                 video: expect.objectContaining({
-                    deviceId: { ideal: FAKE_VIDEO_INPUT_ID },
+                    deviceId: { exact: FAKE_VIDEO_INPUT_ID },
                 }),
             }),
         );
@@ -331,6 +331,80 @@ describe("Media Handler", function () {
 
             expect(stream.getVideoTracks().length).toEqual(0);
         });
+
+        it("falls back to ideal deviceId when exact deviceId fails", async () => {
+            // First call with exact should fail
+            mockMediaDevices.getUserMedia
+                .mockRejectedValueOnce(new Error("OverconstrainedError"))
+                .mockImplementation((constraints: MediaStreamConstraints) => {
+                    const stream = new MockMediaStream("local_stream");
+                    if (constraints.audio) {
+                        const track = new MockMediaStreamTrack("audio_track", "audio");
+                        track.settings = { deviceId: FAKE_AUDIO_INPUT_ID };
+                        stream.addTrack(track);
+                    }
+                    return Promise.resolve(stream.typed());
+                });
+
+            const stream = await mediaHandler.getUserMediaStream(true, false);
+
+            // Should have been called twice: once with exact, once with ideal
+            expect(mockMediaDevices.getUserMedia).toHaveBeenCalledTimes(2);
+            expect(mockMediaDevices.getUserMedia).toHaveBeenNthCalledWith(
+                1,
+                expect.objectContaining({
+                    audio: expect.objectContaining({
+                        deviceId: { exact: FAKE_AUDIO_INPUT_ID },
+                    }),
+                }),
+            );
+            expect(mockMediaDevices.getUserMedia).toHaveBeenNthCalledWith(
+                2,
+                expect.objectContaining({
+                    audio: expect.objectContaining({
+                        deviceId: { ideal: FAKE_AUDIO_INPUT_ID },
+                    }),
+                }),
+            );
+            expect(stream).toBeTruthy();
+        });
+
+        it("falls back to ideal deviceId for video when exact fails", async () => {
+            // First call with exact should fail
+            mockMediaDevices.getUserMedia
+                .mockRejectedValueOnce(new Error("OverconstrainedError"))
+                .mockImplementation((constraints: MediaStreamConstraints) => {
+                    const stream = new MockMediaStream("local_stream");
+                    if (constraints.video) {
+                        const track = new MockMediaStreamTrack("video_track", "video");
+                        track.settings = { deviceId: FAKE_VIDEO_INPUT_ID };
+                        stream.addTrack(track);
+                    }
+                    return Promise.resolve(stream.typed());
+                });
+
+            const stream = await mediaHandler.getUserMediaStream(false, true);
+
+            // Should have been called twice: once with exact, once with ideal
+            expect(mockMediaDevices.getUserMedia).toHaveBeenCalledTimes(2);
+            expect(mockMediaDevices.getUserMedia).toHaveBeenNthCalledWith(
+                1,
+                expect.objectContaining({
+                    video: expect.objectContaining({
+                        deviceId: { exact: FAKE_VIDEO_INPUT_ID },
+                    }),
+                }),
+            );
+            expect(mockMediaDevices.getUserMedia).toHaveBeenNthCalledWith(
+                2,
+                expect.objectContaining({
+                    video: expect.objectContaining({
+                        deviceId: { ideal: FAKE_VIDEO_INPUT_ID },
+                    }),
+                }),
+            );
+            expect(stream).toBeTruthy();
+        });
     });
 
     describe("getScreensharingStream", () => {

src/webrtc/mediaHandler.ts

@@ -264,8 +264,19 @@ export class MediaHandler extends TypedEventEmitter<
         }
 
         if (!canReuseStream) {
-            const constraints = this.getUserMediaContraints(shouldRequestAudio, shouldRequestVideo);
-            stream = await navigator.mediaDevices.getUserMedia(constraints);
+            let constraints: MediaStreamConstraints;
+            try {
+                // Not specifying exact for deviceId means switching devices does not always work,
+                // try with exact and fallback to ideal if it fails
+                constraints = this.getUserMediaContraints(shouldRequestAudio, shouldRequestVideo, true);
+                stream = await navigator.mediaDevices.getUserMedia(constraints);
+            } catch (e) {
+                logger.warn(
+                    `MediaHandler getUserMediaStreamInternal() error (e=${e}), retrying without exact deviceId`,
+                );
+                constraints = this.getUserMediaContraints(shouldRequestAudio, shouldRequestVideo, false);
+                stream = await navigator.mediaDevices.getUserMedia(constraints);
+            }
             logger.log(
                 `MediaHandler getUserMediaStreamInternal() calling getUserMediaStream (streamId=${
                     stream.id
@@ -435,30 +446,36 @@ export class MediaHandler extends TypedEventEmitter<
         this.emit(MediaHandlerEvent.LocalStreamsChanged);
     }
 
-    private getUserMediaContraints(audio: boolean, video: boolean): MediaStreamConstraints {
+    private getUserMediaContraints(audio: boolean, video: boolean, exactDeviceId?: boolean): MediaStreamConstraints {
         const isWebkit = !!navigator.webkitGetUserMedia;
+        const deviceIdKey = exactDeviceId ? "exact" : "ideal";
+
+        const audioConstraints: MediaTrackConstraints = {};
+        if (this.audioInput) {
+            audioConstraints.deviceId = { [deviceIdKey]: this.audioInput };
+        }
+        if (this.audioSettings) {
+            audioConstraints.autoGainControl = { ideal: this.audioSettings.autoGainControl };
+            audioConstraints.echoCancellation = { ideal: this.audioSettings.echoCancellation };
+            audioConstraints.noiseSuppression = { ideal: this.audioSettings.noiseSuppression };
+        }
+
+        const videoConstraints: MediaTrackConstraints = {
+            /* We want 640x360.  Chrome will give it only if we ask exactly,
+               FF refuses entirely if we ask exactly, so have to ask for ideal
+               instead
+               XXX: Is this still true?
+             */
+            width: isWebkit ? { exact: 640 } : { ideal: 640 },
+            height: isWebkit ? { exact: 360 } : { ideal: 360 },
+        };
+        if (this.videoInput) {
+            videoConstraints.deviceId = { [deviceIdKey]: this.videoInput };
+        }
 
         return {
-            audio: audio
-                ? {
-                      deviceId: this.audioInput ? { ideal: this.audioInput } : undefined,
-                      autoGainControl: this.audioSettings ? { ideal: this.audioSettings.autoGainControl } : undefined,
-                      echoCancellation: this.audioSettings ? { ideal: this.audioSettings.echoCancellation } : undefined,
-                      noiseSuppression: this.audioSettings ? { ideal: this.audioSettings.noiseSuppression } : undefined,
-                  }
-                : false,
-            video: video
-                ? {
-                      deviceId: this.videoInput ? { ideal: this.videoInput } : undefined,
-                      /* We want 640x360.  Chrome will give it only if we ask exactly,
-                   FF refuses entirely if we ask exactly, so have to ask for ideal
-                   instead
-                   XXX: Is this still true?
-                 */
-                      width: isWebkit ? { exact: 640 } : { ideal: 640 },
-                      height: isWebkit ? { exact: 360 } : { ideal: 360 },
-                  }
-                : false,
+            audio: audio ? audioConstraints : false,
+            video: video ? videoConstraints : false,
         };
     }