fix: capture early datachannels

Author: achingbrain

packages/transport-webrtc/src/muxer.ts

@@ -40,26 +40,39 @@ export class DataChannelMuxerFactory implements StreamMuxerFactory {
   private readonly peerConnection: RTCPeerConnection
   private readonly metrics?: CounterGroup
   private readonly dataChannelOptions?: DataChannelOptions
+  private readonly earlyDataChannels: RTCDataChannel[]
 
   constructor (init: DataChannelMuxerFactoryInit) {
+    this.onEarlyDataChannel = this.onEarlyDataChannel.bind(this)
+
     this.peerConnection = init.peerConnection
     this.metrics = init.metrics
     this.protocol = init.protocol ?? MUXER_PROTOCOL
     this.dataChannelOptions = init.dataChannelOptions ?? {}
+    this.peerConnection.addEventListener('datachannel', this.onEarlyDataChannel)
+    this.earlyDataChannels = []
+  }
+
+  private onEarlyDataChannel (evt: RTCDataChannelEvent): void {
+    this.earlyDataChannels.push(evt.channel)
   }
 
   createStreamMuxer (maConn: MultiaddrConnection): StreamMuxer {
+    this.peerConnection.removeEventListener('datachannel', this.onEarlyDataChannel)
+
     return new DataChannelMuxer(maConn, {
       peerConnection: this.peerConnection,
       dataChannelOptions: this.dataChannelOptions,
       metrics: this.metrics,
-      protocol: this.protocol
+      protocol: this.protocol,
+      earlyDataChannels: this.earlyDataChannels
     })
   }
 }
 
 export interface DataChannelMuxerInit extends DataChannelMuxerFactoryInit {
   protocol: string
+  earlyDataChannels: RTCDataChannel[]
 }
 
 export interface DataChannelMuxerComponents {
@@ -90,27 +103,37 @@ export class DataChannelMuxer extends AbstractStreamMuxer<WebRTCStream> implemen
      * {@link https://developer.mozilla.org/en-US/docs/Web/API/RTCPeerConnection/datachannel_event}
      */
     this.peerConnection.ondatachannel = ({ channel }) => {
-      this.log('incoming datachannel with channel id %d, protocol %s and status %s', channel.id, channel.protocol, channel.readyState)
-
-      // 'init' channel is only used during connection establishment, it is
-      // closed by the initiator
-      if (channel.label === 'init') {
-        this.log.trace('closing init channel %d', channel.id)
-        channel.close()
-
-        return
-      }
-
-      const stream = createStream({
-        ...this.streamOptions,
-        ...this.dataChannelOptions,
-        channel,
-        direction: 'inbound',
-        log: this.log
+      this.onDataChannel(channel)
+    }
+
+    queueMicrotask(() => {
+      init.earlyDataChannels.forEach(channel => {
+        this.onDataChannel(channel)
       })
+    })
+  }
+
+  private onDataChannel (channel: RTCDataChannel): void {
+    this.log('incoming datachannel with channel id %d, protocol %s and status %s', channel.id, channel.protocol, channel.readyState)
 
-      this.onRemoteStream(stream)
+    // 'init' channel is only used during connection establishment, it is
+    // closed by the initiator
+    if (channel.label === 'init') {
+      this.log.trace('closing init channel %d', channel.id)
+      channel.close()
+
+      return
     }
+
+    const stream = createStream({
+      ...this.streamOptions,
+      ...this.dataChannelOptions,
+      channel,
+      direction: 'inbound',
+      log: this.log
+    })
+
+    this.onRemoteStream(stream)
   }
 
   async onCreateStream (options?: CreateStreamOptions): Promise<WebRTCStream> {