Both of the following statements return false in both Chrome and Safari on my Mac OS. Yet, I can play the .caf container of an opus codec in Safari and I can play the .opus version in Chrome.
const caf = MediaSource.isTypeSupported("audio/x-caf")
const opus = MediaSource.isTypeSupported("audio/ogg") // also tried "audio/opus"
I figure I must be using it wrong, but the API and list of codecs is quite limited. I used ffmpeg to generate the .caf and .opus files and when I look at the mime of them it shows application/octet-stream, even though they work as expected. So I can't use the files to determine the appropriate mime type.
I have no way of reliably distinguishing which file to download given that Apple products support .caf and non-Apple support .opus. I would like to refrain from using browser detection as it's not future proof or reliable.
You are certainly conflating the MediaSource.isTypeSupported() static method with the HTMLMediaElement#canPlayType() instance method.
These are different APIs and they'll return different results: far less media formats can be used with the MediaSource API.
const test = (type) => {
console.log(type, new Audio().canPlayType(type) === "maybe");
};
test("audio/ogg"); // true in Chrome & Firefox
test("audio/x-caf"); // true in Safari