twilio / video-quickstart-js

A quickstart and code samples for Twilio Video JavaScript SDK. https://www.twilio.com/docs/video
Other
389 stars 337 forks source link

Property 'attach' does not exist on type 'RemoteTrack' #190

Closed juanigaray closed 2 years ago

juanigaray commented 3 years ago

I'm using "twilio-video": "^2.15.1" and reading through the docs which say "Javascript 2.x". Here: https://www.twilio.com/docs/video/javascript-getting-started#display-a-remote-participants-video it says:

We can handle the former by iterating over tracks and we can handle the latter by attaching an event listener for "trackSubscribed":

// Attach the Participant's Media to a <div> element.
room.on('participantConnected', participant => {
  console.log(`Participant "${participant.identity}" connected`);

  participant.tracks.forEach(publication => {
    if (publication.isSubscribed) {
      const track = publication.track;
      document.getElementById('remote-media-div').appendChild(track.attach());
    }
  });

  participant.on('trackSubscribed', track => {
    document.getElementById('remote-media-div').appendChild(track.attach());
  });
});

However, when doing that on my TS project, this happens:

image

Property 'attach' does not exist on type 'RemoteTrack'.
  Property 'attach' does not exist on type 'RemoteDataTrack'.ts(2339)

I believe there's either a problem with the documentation (it's possibly outdated, see #101 ) or the typing is incomplete.

EDIT: So I found one workaround for this: You have to check the kind of the track. If you make a type guard checking that the kind is "video" it will let you attach it. This is still a problem with the docs!

PikaJoyce commented 2 years ago

Hi @JuanGaray93!

Thank you for filing this issue with us. Oh no, I'm sorry you're facing issues with our documentation. I have created an internal ticket(VIDEO-7431) in order to track this issue. Thank you for your feedback and please rest assured we will work on improving our documentation in the near future. With that being said, I'll keep this issue open and update it when things get moving!

Best, Joyce

brkcrdk commented 2 years ago

Hello @JuanGaray93 i know that you solved your problem long ago and it happened to me yesterday too. I tried your solution and it worked but this solution made my application to subscribe only video track which audio track is not attached to video element. So if i would've make that way i would have to add extre audio elements which is not a good solution.

@PikaJoyce My solution to this problem was make subscription to that track if kind is not data. I think video element is not attachable with data so thats why typescript gives this error. I strongly believe that docs should have typescript version of their examples.

Thank you for sharing your solution @JuanGaray93 ! 🙏🏻 👍🏻