Working around WebRTC bugs

WebRTC bugs… my favorite topic as you may have just seen at ClueCon. One of the questions I got was whether I keep knowledge of those bugs to myself. Well… I try not to. In the spirit of full disclosure here is how we at appear.in work around two of the more annoying Chrome bugs right now.

Failure to acquire the microphone on OSX

On MacOSX (and probably also on Windows), Chrome sometimes can not acquire data from the microphone. The getUserMedia call will succeed but the microphone doesn’t capture any data. This issue has been around for a while. It typically results in “the other side can’t hear me” style issues.

pc.getStats(null).then(function (result) {
Object.keys(result).forEach(function(id) {
var report = result[id];
if (id.indexOf('_send') !== -1 &&
report.type === 'ssrc' &&
report.mediaType === 'audio' &&
parseInt(report.bytesSent, 10) === 0) {
// show a warning
}
});
});
result.forEach((report) => {
if (report.type === 'outbound-rtp' &&
report.mediaType === 'audio' &&
report.bytesSent === 0) {
// show a warning
}
});

The camera is used by another application

Sometimes, your camera is used by another application. When testing, I often have both Chrome and Firefox open and both browsers try to access the camera. Firefox throws an InternalError, Chrome allows camera access but never displays or sends any video. This bug has also been known for quite a while (pro-tip: doing triage in the bug tracker pays off). On the other side of the peerconnection this may have some more serious issues like not playing audio at all (sounds confusing? See here for the full story)

var track = stream.getVideoTracks()[0];// not useful for desktop sharing
if (track.label === ‘Screen’) return;
if (track.readyState === ‘ended’) {
// show a warning
}
navigator.mediaDevices.getUserMedia({video: true})
.then(stream => {
// do your thing with the stream
}, (e) => {
if (e.name === 'TrackStartError') {
// show same warning as before
});

doing things webrtc @appear_in