Captions added dynamically via addTextTrack and addCue do not display in Safari.

[peranderson]

Description

Captions do not display when dynamically added using addTextTrack and addCue via Javascript in Safari. Chrome and Firefox work properly. https://jsfiddle.net/4utd9bwo/3/

Steps to reproduce

1. Add a
2. Init via Videojs.
3. Dynamically add a text track.
4. Dynamically add a cue.
5. Play the video.

Results

Expected

I expect to see the caption displayed.

Actual

Track and cues are added to the native video object but captions are not displayed on screen.

Error output

No errors reported to the console.

Additional Information

Captions do work properly in Safari if and only if you add them by the element sourced to an external WebVTT file.

versions

videojs

5.8.8 in the fiddle. I'm currently using 5.13.2. Neither work.

browsers

I have Safari 10.0.1

OSes

OSX 10.10.5

plugins

None.

[peranderson]

Safari requires at least one track element to be present. To fix this issue I simply added a default track with an empty.vtt file as the source. Once I did that, I could programmatically add cues and add other tracks via the API.

[mkalygin]

For those who has issues with tracks in Safari, make sure you have default attribute set on one of the tracks. Without it Safari doesn't load vtt file at all.

[tsi]

It seems like the original fiddle now works as expected.
But I get the same issue with an up-to-date version of video.js
Original fiddle with video.js 5.8.8 - https://jsfiddle.net/4utd9bwo/3/ text-track shows in Safari
with video.js 8.7.0 - https://jsfiddle.net/tsish/dqseLznr/ text-track won't display in Safari
Any hints? Am I missing something?