@mister-ben fixed missing native HTML5 tracks. Fixes #2689. Closes #3212

CHANGELOG.md

@@ -5,6 +5,7 @@ CHANGELOG
 * @llun fixed menus from throwing when focused when empty ([view](https://github.com/videojs/video.js/pull/3218))
 * @mister-ben added dir=ltr to control bar and loading spinner ([view](https://github.com/videojs/video.js/pull/3221))
 * @avreg fixed notSupportedMessage saying video when meaning media ([view](https://github.com/videojs/video.js/pull/3222))
+* @mister-ben fixed missing native HTML5 tracks ([view](https://github.com/videojs/video.js/pull/3212))
 
 --------------------
 

src/js/tech/html5.js

@@ -257,12 +257,20 @@ class Html5 extends Tech {
   proxyNativeTextTracks_() {
     let tt = this.el().textTracks;
 
-    if (tt && tt.addEventListener) {
+    if (tt) {
+      // Add tracks - if player is initialised after DOM loaded, textTracks
+      // will not trigger addtrack
+      for (let i = 0; i < tt.length; i++) {
+        this.textTracks().addTrack_(tt[i]);
+      }
+
+      if (tt.addEventListener) {
         tt.addEventListener('change', this.handleTextTrackChange_);
         tt.addEventListener('addtrack', this.handleTextTrackAdd_);
         tt.addEventListener('removetrack', this.handleTextTrackRemove_);
       }
     }
+  }
 
   handleTextTrackChange(e) {
     let tt = this.textTracks();

src/js/tracks/text-track-list.js

@@ -78,14 +78,18 @@ class TextTrackList extends EventTarget {
     track.addEventListener('modechange', Fn.bind(this, function() {
       this.trigger('change');
     }));
-    this.tracks_.push(track);
 
+    // Do not add duplicate tracks
+    if (this.tracks_.indexOf(track) === -1) {
+      this.tracks_.push(track);
       this.trigger({
         track,
         type: 'addtrack'
       });
     }
 
+  }
+
   /**
    * Remove TextTrack from TextTrackList
    * NOTE: Be mindful of what is passed in as it may be a HTMLTrackElement