Problems with H.264 codecs in firefox

[ignl]

Description

1. If I choose "video/webm;codecs=H264" mime type for chrome and record it, codecs of video file are correct but it doesn't play on firefox.
2. If I choose "video/mp4" mime type for firefox I still get record with vp8 codecs.
3. Maybe unrelated, but ts-ebml example doesn't work on both firefox and chrome for me.

versions

videojs

video.js 7.5.0
videojs.record.js 3.3.0
RecordRTC 5.5.3

browsers

Firefox 64 + Chrome 71

OSes

Ubuntu 18.10

[thijstriemstra]

Maybe unrelated, but ts-ebml example doesn't work on both firefox and chrome for me.

Good catch, fixed.

[thijstriemstra]

@ignl take a look at muaz-khan/RecordRTC#97

[ignl]

Yeah I saw that issue during my search. It seems that Firefox does not support matroska container and Chrome for some reason uses matroska instead of mp4 container for h.264 records.
According to videojs-record documentation mime "video/mp4" should work for firefox, but the video is still vp8 when I check. Did it work for you at some point @thijstriemstra?

[thijstriemstra]

You can check supported types for MediaRecorder using:

MediaRecorder.isTypeSupported("video/webm;codecs=H264")
MediaRecorder.isTypeSupported("video/mp4")

In Firefox 64 on Ubuntu all statements above return false.

The Firefox docs have an example: https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/isTypeSupported

var types = ["video/webm", 
             "audio/webm", 
             "video/webm\;codecs=vp8", 
             "video/webm\;codecs=daala", 
             "video/webm\;codecs=h264", 
             "audio/webm\;codecs=opus", 
             "video/mpeg"];

for (var i in types) { 
  console.log( "Is " + types[i] + " supported? " + (MediaRecorder.isTypeSupported(types[i]) ? "Maybe!" : "Nope :(")); 
}

Which returns:

Is video/webm supported? Maybe! debugger eval code:10:3
Is audio/webm supported? Maybe! debugger eval code:10:3
Is video/webm;codecs=vp8 supported? Maybe! debugger eval code:10:3
Is video/webm;codecs=daala supported? Nope :( debugger eval code:10:3
Is video/webm;codecs=h264 supported? Nope :( debugger eval code:10:3
Is audio/webm;codecs=opus supported? Maybe! debugger eval code:10:3
Is video/mpeg supported? Nope :( debugger eval code:10:3

[thijstriemstra]

Also see https://www.webrtc-experiment.com/RecordRTC/simple-demos/isTypeSupported.html.

Closing ticket since there's not much we can do (firefox browser issue).

[thijstriemstra]

Looks like Firefox 65 introduced support for the AV1 codec (already available in Chrome), maybe that could be an alternative..

https://medium.com/mozilla-tech/mozilla-celebrates-release-of-free-high-quality-video-compression-technology-av1-in-firefox-65-7c95f2b7e56

Give this a try in Firefox 65 or newer: https://codepen.io/miguelao/pen/edqNab?editors=0010

[thijstriemstra]

Also interesting statement here: https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/mimeType

"Keep in mind, of course, that the file format and the codecs associated with the individual tracks are different things entirely; writing tracks that work just fine in a WebM video into an MP4 wrapper may not result in a file that plays everywhere you want it to."

[ignl]

OK thanks for references! Let's hope AV1 will work better. Good thing is that apple also participates in that consortium so there is a chance it will adopt it for Safari.

[guest271314]

If I choose "video/webm;codecs=H264" mime type for chrome and record it, codecs of video file are correct but it doesn't play on firefox.

See https://bugs.chromium.org/p/chromium/issues/detail?id=980822