894556 - Multiple video tracks in a MediaStream are not reflected on the videoTracks object on the video element

Paul Kinlan
Available in: English (Original) Deutsch Español 日本語 मानक हिन्दी русский язык tiếng Việt தமிழ் bahasa Indonesia

Le premier numéro que j’ai trouvé en essayant de créer un éditeur de vidéo sur le Web.

J’ai plusieurs flux vidéo (ordinateur de bureau et webcam) et je voulais pouvoir basculer entre les flux vidéo sur un élément vidéo afin de pouvoir basculer rapidement entre la webcam et le bureau et ne pas casser le MediaRecorder.

Il semble que vous devriez pouvoir le faire en basculant la propriété selected sur l'objetvideoTracks du <video>élément, mais vous ne pouvez pas, le tableau de pistes ne contient qu'un seul élément (la première piste vidéo sur le flux multimédia).

What steps will reproduce the problem? (1) Get two MediaStreams with video tracks (2) Add them to a new MediaStream and attach as srcObject on a videoElement (3) Check the videoElement.videoTracks object and see there is only one track

Demo at https://multiple-tracks-bug.glitch.me/

What is the expected result? I would expect videoElement.videoTracks to have two elements.

What happens instead? It only has the first videoTrack that was added to the MediaStream.

Lire l’article complet.

Cas de repro.

window.onload = () => {
  if('getDisplayMedia' in navigator) warning.style.display = 'none';

  let blobs;
  let blob;
  let rec;
  let stream;
  let webcamStream;
  let desktopStream;

  captureBtn.onclick = async () => {

       
    desktopStream = await navigator.getDisplayMedia({video:true});
    webcamStream = await navigator.mediaDevices.getUserMedia({video: { height: 1080, width: 1920 }, audio: true});
    
    // Always 
    let tracks = [...desktopStream.getTracks(), ... webcamStream.getTracks()]
    console.log('Tracks to add to stream', tracks);
    stream = new MediaStream(tracks);
    
    console.log('Tracks on stream', stream.getTracks());
    
    videoElement.srcObject = stream;
    
    console.log('Tracks on video element that has stream', videoElement.videoTracks)
    
    // I would expect the length to be 2 and not 1
  };

};

Paul Kinlan

Trying to make the web and developers better.

RSS Github Medium