WebRTC Events in Firefox

Question

I have a working WebRTC connection in Chrome. It uses 1 data channel as part of a chat application.

I want to also support Firefox thus I need to change some not supported events: For the RTCPeerConnection as well as for the DataChannel.

The changes to the data channel worked as expected:

    //chrome implenetation
    dc.onopen = this.conncectionStats.bind(this);
    dc.onmessage = onMessage;
    // chrome and firefox
    dc.addEventListener('open', (event) => {
        this.conncectionStats.bind(this)
    });
    dc.addEventListener('message', (event) => {
        onMessage(event)
    });

However, the problem arises when changing the PeerConnection:

    // chrome implenetation
    pc.onconnectionstatechange  = this.onConnectionStateChange.bind(this);
    // chrome and firefox
    pc.addEventListener('onconnectionstatechange', (event) => {
        console.log("onconnectionstatechange fired")
        this.onConnectionStateChange.bind(this);
    })

The event is never occuring. Any ideas why this is the case?

The event should be correct, but on the other hand, the documentation is missing on MDN Web Docs.

Answer 1

You should use WebRTC adapter so that unsupported events will be shimmed for you: https://github.com/webrtc/adapter

I am using it on my webpages, and onconnectionstatechange fires fine in Firefox:

...
pc.onconnectionstatechange = onConnStateChange;
...

function onConnStateChange(event) {
        if (pc.connectionState === "failed") {
            Terminate();
            alert("Connection failed; playback stopped");
        }
    }