HTMLMediaElement/textTracks example video does not load

[third774]

trafficstars

MDN URL

https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/textTracks

What specific section or headline is this issue about?

https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/textTracks#examples

What information was incorrect, unhelpful, or incomplete?

The .mp4 fails to load with a 404 response code.

What did you expect to see?

The video to load correctly

Do you have any supporting links, references, or citations?

No response

Do you have anything more you want to share?

No response

[wbamberg]

This is tricky to fix.

The example doesn't actually need a working video, or even working vtt files, because it's just demonstrating how to use textTracks, and that works without the files.

A worse problem IMO is that it uses console.log() for the output, so you can't see any output in the example. That's easy enough to fix.

But if we did want working resources, then we can do it for the video but not for the vtt files themselves, because the MDN platform doesn't support local vtts in live samples, and (I believe) the CSP will prevent remote vtts from loading. What would be needed is something like https://github.com/mdn/yari/issues/5727 but for vtt files.

In the absence of that, we could do either of:

• just make this a non-live example, so there's no expectation of it running
• keep it with a non-working video, but log the info to the example iframe instead of the console.

[bsmth]

There's a CSP rule incoming in https://github.com/mdn/yari/pull/10858 that should help with this. When that's deployed, we can fix the example to load the remote vtt and an actual video, too https://github.com/mdn/shared-assets/tree/main/videos