Cannot use datatrack immediately after connection

[EdGallimore]

• I have verified that the issue occurs with the latest twilio-video.js release and is not marked as a known issue in the CHANGELOG.md.
• I reviewed the Common Issues and open GitHub issues and verified that this report represents a potentially new issue.
• I verified that the Quickstart application works in my environment.
• I am not sharing any Personally Identifiable Information (PII)
  or sensitive account information (API keys, credentials, etc.) when reporting this issue.

Behaviour
Our application connects to a room, passing into the connect method local audio, video and data tracks. when the returned promise resolves we immediately attempt to send a message on the DataTrack. The message is not received by the other participants. No error is thrown when the send method is called.

Observations
We have added additional logging. It seems the underlying RTCDataChannel readyState is 'connecting' when we initially attempt to send (the RTCDataChannel can only be accessed by digging deep into private member variables). This connecting state does not seem to be exposed in any twilio objects/attributes that we can find. If we delay the initial send until after the RTCDataChannel emits an open event the message is received by the other room participants.

On investigation it seems possible the send method might be throwing an error (given the state of the connection). But it appears that the DataTrackSender twillio-video implementation swallows errors (rather than handling or even logging them to the logger)
Code snippet from twilio-video below

 send(data) {
    this._dataChannels.forEach(dataChannel => {
      try {
        dataChannel.send(data);
      } catch (error) {
        // Do nothing.
      }
    });
    this._clones.forEach(clone => {
      try {
        clone.send(data);
      } catch (error) {
        // Do nothing.
      }
    });
    return this;
  }

Expected behaviour
Connect only returns once the tracks are all 'working'
and/or, some way to detect if the datatrack is ready for data to be sent
and/or, Datatrack send should throw an error if in an incorrect state (or at least outout to the log)
and/or, requests could be queued until the connection is fully established (they will be queued when the connection is open i believe)

Software versions:
Chrome v91 on MacOs
twilio-video.js 2.15.1
react 17.0.2

[charliesantos]

@EdGallimore the repro steps seems very similar to this other issue you filed #1509 . Can you combine both if possible?

[EdGallimore]

While we did encounter both issues debugging the same problem I believe they are independent issues. Never-the-less happy to combine #1509 into this issue.

[charliesantos]

Hi @EdGallimore thank you for combining the two tickets. Just so I can understand your steps better, can you please provide a code snippet base on how you describe the issue below?

Our application connects to a room, passing into the connect method local audio, video and data tracks. when the returned promise resolves we immediately attempt to send a message on the DataTrack. The message is not received by the other participants. No error is thrown when the send method is called.

In your code snippet, I like to see how you're creating the data tracks, passing to your connect options, and how you're sending a message after connecting to a room.