@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,10 +257,18 @@ class Html5 extends Tech {
   proxyNativeTextTracks_() {
     let tt = this.el().textTracks;
 
-    if (tt && tt.addEventListener) {
+    if (tt) {
-      tt.addEventListener('change', this.handleTextTrackChange_);
+      // Add tracks - if player is initialised after DOM loaded, textTracks
-      tt.addEventListener('addtrack', this.handleTextTrackAdd_);
+      // will not trigger addtrack
-      tt.addEventListener('removetrack', this.handleTextTrackRemove_);
+      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_);
+      }
     }
   }
 
@@ -504,7 +512,7 @@ class Html5 extends Tech {
    * @return {Object}
    * @method currentSrc
    */
-  currentSrc() { 
+  currentSrc() {
     if (this.currentSource_) {
       return this.currentSource_.src;
     } else {

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

@@ -78,12 +78,16 @@ class TextTrackList extends EventTarget {
     track.addEventListener('modechange', Fn.bind(this, function() {
       this.trigger('change');
     }));
-    this.tracks_.push(track);
 
-    this.trigger({
+    // Do not add duplicate tracks
-      track,
+    if (this.tracks_.indexOf(track) === -1) {
-      type: 'addtrack'
+      this.tracks_.push(track);
-    });
+      this.trigger({
+        track,
+        type: 'addtrack'
+      });
+    }
+
   }
 
   /**