title: Can not change camera in mobile Chrome or Safari during WebRTC call
body: <p>I use <code>navigator.mediaDevices.enumerateDevices</code> to retrieve list of all video devices (<code>element.kind === 'videoinput'</code>) and then call <code>navigator.mediaDevices.getUserMedia(constraints)</code> call to rotate video devices (using deviceId as constraint). Everything works fine on Windows Chrome / Firefox, but on android phone (tried Samsung, Asus, Huawei with Android 8/9) this call fails for <strong>back camera</strong> with NotReadableError / Could not start video source (for Chrome) or AbortError / Starting video failed (for Firefox).
  Strangely same code works ok in iOS / Safari.
  Also this only happens when WebRTC call is present in browser. If there is no call I can select any video device.
  Also if I select back camera first and try to establish the call, it does not work, I get similar error.
  I know it's far-fetched but maybe someone had same/similar issue?
  All browser versions are up-to-date.</p>
  <p>[UPDATE - code snippet and log]</p>
  <pre><code>switchCamera() {
  try {
    if (this.localStream) {
      const tracks = this.localStream.getTracks();
      console.log('switchCamera stopping this.localStream tracks', tracks);
      tracks.forEach((track: MediaStreamTrack) =&gt; {
        console.log('switchCamera stopping track', track);
        track.stop();
      });
      console.log('switchCamera stop stream');
    }
  
    const constraints = {
      audio: true,
      video: { facingMode: this.faceCamera ? 'environment' : 'face' }
    };
    this.faceCamera = !this.faceCamera;
    console.log('switchCamera constraints: ', constraints);
    navigator.mediaDevices.getUserMedia(constraints)
      .then(stream =&gt; {
        console.log('getUserMedia:', stream);
        this.logText('got stream');
  
        this.localVideo.srcObject = stream;
  
        const videoTracks = stream.getVideoTracks();
        const audioTracks = stream.getAudioTracks();
        console.log('videoTracks', videoTracks);
        if (videoTracks.length &gt; 0) {
          console.log(`Using video device: ${videoTracks[0].label}`);
        }
  
        const videoTrack = videoTracks[0];
        const audioTrack = audioTracks[0];
  
        console.log('Replacing track for pc', videoTrack, audioTrack);
  
        const pc = this.session.sessionDescriptionHandler.peerConnection;
  
        const videoSender = pc.getSenders().find(s =&gt; {
          return s.track &amp;&amp; s.track.kind === videoTrack.kind;
        });
        const audioSender = pc.getSenders().find(s =&gt; {
          return s.track &amp;&amp; s.track.kind === audioTrack.kind;
        });
  
        if (videoSender) {
          console.log('videoSender.replaceTrack', videoTrack);
          videoSender.replaceTrack(videoTrack);
        }
        if (audioSender) {
          console.log('audioSender.replaceTrack', audioTrack);
          audioSender.replaceTrack(audioTrack);
        }
      })
      .catch(e =&gt; {
        console.log('getUserMedia error:', e.name, e.code, e.message);
      });
  } catch (e) {
    window.alert(e);
  }
  }
  </code></pre>
  <p>this is the log from chrome remote device debug:</p>
  <p><a href="https://i.stack.imgur.com/qs18E.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/qs18E.png" alt="enter image description here" /></a></p>
  <p>The error is &quot;NotReadableError&quot;, &quot;Could not start video source&quot; which means that the underlying device handle could not be obtained by chrome.
  Again, safari/ios works ok.</p>