Tengo una página web con el siguiente código javascript.

Mi código está escuchando el evento conectado del participante en una habitación determinada.

Cada vez que se conecta un nuevo participante, necesito mostrar su video remoto.

Aquí está mi código:

 var LastTrack; function trackSubscribed(HtmlParent, track) { LastTrack = track; console.log("the track width is : " + track.dimensions.width); console.log("the track Height is : " + track.dimensions.height); HtmlParent.appendChild(track.attach()); } function participantConnected(HtmlParent, participant) { participant.tracks.forEach(publication => { if (publication.isSubscribed) { trackSubscribed(HtmlParent, publication.track); } else { console.log('Track not subscribed'); } }); participant.on('trackSubscribed', track => trackSubscribed(HtmlParent, track)); }

Este código nunca funciona la primera vez. El video remoto no se agrega el html dom y en los registros tengo:

 the track width is : null the track height is : null

Sin embargo, si llamo manualmente (unos segundos más tarde) a la función trackSubscribed (HtmlParent, LastTrack), entonces funciona. El video se muestra como se esperaba y las dimensiones son correctas:

 the track width is : 640 the track height is : 480

Es como cuando trato de agregar la pista al dom html la primera vez, la pista no está "lista".

¿Alguien sabe qué estoy haciendo mal aquí?

Gracias. Salud,