Fix video corruption on rendition switches in IE11 Win 8.1+ and Edge (#…

…1259)

* segment-time-mapping event
* update contrib-media-sources to 4.6.0

package.json

@@ -92,10 +92,10 @@
     "aes-decrypter": "1.0.3",
     "global": "^4.3.0",
     "m3u8-parser": "2.1.0",
-    "mux.js": "4.2.2",
+    "mux.js": "4.3.0",
     "url-toolkit": "1.0.9",
     "video.js": "^5.19.1 || ^6.2.0",
-    "videojs-contrib-media-sources": "4.5.3",
+    "videojs-contrib-media-sources": "4.6.0",
     "webworkify": "1.0.2"
   },
   "devDependencies": {

src/master-playlist-controller.js

@@ -609,9 +609,20 @@ export class MasterPlaylistController extends videojs.EventTarget {
     });
 
     this.mainSegmentLoader_.on('reseteverything', () => {
+      // If playing an MTS stream, a videojs.MediaSource is listening for
+      // hls-reset to reset caption parsing state in the transmuxer
       this.tech_.trigger('hls-reset');
     });
 
+    this.mainSegmentLoader_.on('segmenttimemapping', (event) => {
+      // If playing an MTS stream in html, a videojs.MediaSource is listening for
+      // hls-segment-time-mapping update its internal mapping of stream to display time
+      this.tech_.trigger({
+        type: 'hls-segment-time-mapping',
+        mapping: event.mapping
+      });
+    });
+
     this.audioSegmentLoader_.on('ended', () => {
       this.onEndOfStream();
     });

src/segment-loader.js

@@ -1105,8 +1105,6 @@ export default class SegmentLoader extends videojs.EventTarget {
       return;
     }
 
-    this.state = 'APPENDING';
-
     if (segmentInfo.isSyncRequest) {
       this.trigger('syncinfoupdate');
       this.pendingSegment_ = null;
@@ -1121,6 +1119,17 @@ export default class SegmentLoader extends videojs.EventTarget {
       this.trigger('timestampoffset');
     }
 
+    const timelineMapping = this.syncController_.mappingForTimeline(segmentInfo.timeline);
+
+    if (timelineMapping !== null) {
+      this.trigger({
+        type: 'segmenttimemapping',
+        mapping: timelineMapping
+      });
+    }
+
+    this.state = 'APPENDING';
+
     // if the media initialization segment is changing, append it
     // before the content segment
     if (segment.map) {

src/source-updater.js

@@ -77,7 +77,6 @@ export default class SourceUpdater {
    */
   appendBuffer(bytes, done) {
     this.processedAppend_ = true;
-
     this.queueCallback_(() => {
       this.sourceBuffer_.appendBuffer(bytes);
     }, done);

src/sync-controller.js

@@ -451,6 +451,13 @@ export default class SyncController extends videojs.EventTarget {
     return this.timelines[timeline].time;
   }
 
+  mappingForTimeline(timeline) {
+    if (typeof this.timelines[timeline] === 'undefined') {
+      return null;
+    }
+    return this.timelines[timeline].mapping;
+  }
+
   /**
    * Use the "media time" for a segment to generate a mapping to "display time" and
    * save that display time to the segment.

test/segment-loader.test.js

@@ -345,6 +345,48 @@ QUnit.module('SegmentLoader', function(hooks) {
       assert.equal(loader.mediaRequests, 1, '1 request');
     });
 
+    QUnit.test('loader triggers segmenttimemapping before appending segment',
+    function(assert) {
+      let playlist = playlistWithDuration(20);
+      let segmenttimemappings = 0;
+      let timingInfo = { hasMapping: false };
+
+      this.syncController.probeSegmentInfo = () => timingInfo;
+
+      loader.on('segmenttimemapping', function() {
+        segmenttimemappings++;
+      });
+
+      loader.playlist(playlist);
+      loader.mimeType(this.mimeType);
+      loader.load();
+      this.clock.tick(1);
+
+      assert.equal(segmenttimemappings, 0, 'no events before segment downloaded');
+
+      // some time passes and a response is received
+      this.requests[0].response = new Uint8Array(10).buffer;
+      this.requests.shift().respond(200, null, '');
+
+      assert.equal(segmenttimemappings, 0,
+        'did not trigger segmenttimemappings with unsuccessful probe');
+
+      this.updateend();
+      this.clock.tick(1);
+
+      assert.equal(segmenttimemappings, 0, 'no events before segment downloaded');
+
+      timingInfo.hasMapping = true;
+      this.syncController.timelines[0] = { mapping: 0 };
+
+      // some time passes and a response is received
+      this.requests[0].response = new Uint8Array(10).buffer;
+      this.requests.shift().respond(200, null, '');
+
+      assert.equal(segmenttimemappings, 1,
+        'triggered segmenttimemappings with successful probe');
+    });
+
     QUnit.test('adds cues with segment information to the segment-metadata track ' +
                'as they are buffered',
       function(assert) {