From b33e1091a1a395678f47e23ac0d61eefec173c72 Mon Sep 17 00:00:00 2001
From: Brandon Casey <2381475+brandonocasey@users.noreply.github.com>
Date: Fri, 19 Mar 2021 12:01:56 -0400
Subject: [PATCH] feat: Add  EXT-X-PART support behind a flag for LL-HLS
 (#1055)

---
 index.html                    |   4 ++
 package-lock.json             |   6 +-
 package.json                  |   2 +-
 scripts/index-demo-page.js    |  11 +++-
 src/manifest.js               |  42 ++++++++++++-
 src/media-segment-request.js  |   2 +-
 src/playlist-loader.js        |  95 ++++++++++++++++++++++------
 src/segment-loader.js         | 115 +++++++++++++++++++++++++---------
 src/videojs-http-streaming.js |   3 +-
 test/loader-common.js         | 107 +++++++++++++++++++++++++++++++
 test/segment-loader.test.js   |   1 +
 test/test-helpers.js          |  34 +++++++---
 12 files changed, 357 insertions(+), 65 deletions(-)

diff --git a/index.html b/index.html
index 040ceaa2c..10fce56f4 100644
--- a/index.html
+++ b/index.html
@@ -80,6 +80,10 @@ <h3>Options</h3>
       <input id=partial type="checkbox">
       Handle Partial (reloads player)
     </label>
+    <label>
+      <input id=llhls type="checkbox">
+      [EXPERIMENTAL] Enables support for ll-hls (reloads player)
+    </label>
     <label>
       <input id=buffer-water type="checkbox">
       [EXPERIMENTAL] Use Buffer Level for ABR (reloads player)
diff --git a/package-lock.json b/package-lock.json
index bbf6c656b..c247866c3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6162,9 +6162,9 @@
       }
     },
     "m3u8-parser": {
-      "version": "4.5.2",
-      "resolved": "https://registry.npmjs.org/m3u8-parser/-/m3u8-parser-4.5.2.tgz",
-      "integrity": "sha512-sN/lu3TiRxmG2RFjZxo5c0/7Dr4RrEztl43jXrWwj5gFZ7vfa2iIxGfiPx485dm5QCazaIcKk+vNkUso8Aq0Ag==",
+      "version": "4.6.0",
+      "resolved": "https://registry.npmjs.org/m3u8-parser/-/m3u8-parser-4.6.0.tgz",
+      "integrity": "sha512-dKhhpMcPqDM/KzULVrNyDZ/z766peQjwUghDTcl6TE7DQKAt/vm74/IMUAxpO34f6LDpM+OH/dYGQwW1eM4yWw==",
       "requires": {
         "@babel/runtime": "^7.12.5",
         "@videojs/vhs-utils": "^3.0.0",
diff --git a/package.json b/package.json
index 5a5484368..67b179140 100644
--- a/package.json
+++ b/package.json
@@ -60,7 +60,7 @@
     "@videojs/vhs-utils": "^3.0.0",
     "aes-decrypter": "3.1.2",
     "global": "^4.4.0",
-    "m3u8-parser": "4.5.2",
+    "m3u8-parser": "4.6.0",
     "mpd-parser": "0.15.4",
     "mux.js": "5.10.0",
     "video.js": "^6 || ^7"
diff --git a/scripts/index-demo-page.js b/scripts/index-demo-page.js
index 7e4b7479e..3ef5346b5 100644
--- a/scripts/index-demo-page.js
+++ b/scripts/index-demo-page.js
@@ -241,6 +241,7 @@
     'sync-workers',
     'liveui',
     'partial',
+    'llhls',
     'url',
     'type',
     'keysystems',
@@ -300,6 +301,13 @@
       window.videojs.log.level(event.target.checked ? 'debug' : 'info');
     });
 
+    stateEls.llhls.addEventListener('change', function(event) {
+      saveState();
+
+      // reload the player and scripts
+      stateEls.minified.dispatchEvent(newEvent('change'));
+    });
+
     stateEls.partial.addEventListener('change', function(event) {
       saveState();
 
@@ -377,7 +385,8 @@
             vhs: {
               overrideNative: getInputValue(stateEls['override-native']),
               handlePartialData: getInputValue(stateEls.partial),
-              experimentalBufferBasedABR: getInputValue(stateEls['buffer-water'])
+              experimentalBufferBasedABR: getInputValue(stateEls['buffer-water']),
+              experimentalLLHLS: getInputValue(stateEls.llhls)
             }
           }
         });
diff --git a/src/manifest.js b/src/manifest.js
index 532d3e02a..48adac6ce 100644
--- a/src/manifest.js
+++ b/src/manifest.js
@@ -12,12 +12,18 @@ export const createPlaylistID = (index, uri) => {
 /**
  * Parses a given m3u8 playlist
  *
+ * @param {Function} [onwarn]
+ *        a function to call when the parser triggers a warning event.
+ * @param {Function} [oninfo]
+ *        a function to call when the parser triggers an info event.
  * @param {string} manifestString
  *        The downloaded manifest string
  * @param {Object[]} [customTagParsers]
  *        An array of custom tag parsers for the m3u8-parser instance
  * @param {Object[]} [customTagMappers]
- *         An array of custom tag mappers for the m3u8-parser instance
+ *        An array of custom tag mappers for the m3u8-parser instance
+ * @param {boolean} [experimentalLLHLS=false]
+ *        Whether to keep ll-hls features in the manifest after parsing.
  * @return {Object}
  *         The manifest object
  */
@@ -26,7 +32,8 @@ export const parseManifest = ({
   oninfo,
   manifestString,
   customTagParsers = [],
-  customTagMappers = []
+  customTagMappers = [],
+  experimentalLLHLS
 }) => {
   const parser = new M3u8Parser();
 
@@ -43,7 +50,36 @@ export const parseManifest = ({
   parser.push(manifestString);
   parser.end();
 
-  return parser.manifest;
+  const manifest = parser.manifest;
+
+  // remove llhls features from the parsed manifest
+  // if we don't want llhls support.
+  if (!experimentalLLHLS) {
+    [
+      'preloadSegment',
+      'skip',
+      'serverControl',
+      'renditionReports',
+      'partInf',
+      'partTargetDuration'
+    ].forEach(function(k) {
+      if (manifest.hasOwnProperty(k)) {
+        delete manifest[k];
+      }
+    });
+
+    if (manifest.segments) {
+      manifest.segments.forEach(function(segment) {
+        ['parts', 'preloadHints'].forEach(function(k) {
+          if (segment.hasOwnProperty(k)) {
+            delete segment[k];
+          }
+        });
+      });
+    }
+  }
+
+  return manifest;
 };
 
 /**
diff --git a/src/media-segment-request.js b/src/media-segment-request.js
index 53f629c6b..7f3284437 100644
--- a/src/media-segment-request.js
+++ b/src/media-segment-request.js
@@ -971,7 +971,7 @@ export const mediaSegmentRequest = ({
   }
 
   const segmentRequestOptions = videojs.mergeOptions(xhrOptions, {
-    uri: segment.resolvedUri,
+    uri: segment.part && segment.part.resolvedUri || segment.resolvedUri,
     responseType: 'arraybuffer',
     headers: segmentXhrHeaders(segment)
   });
diff --git a/src/playlist-loader.js b/src/playlist-loader.js
index 2f77b3400..4c6a04a1a 100644
--- a/src/playlist-loader.js
+++ b/src/playlist-loader.js
@@ -19,34 +19,73 @@ import {
 const { mergeOptions, EventTarget } = videojs;
 
 /**
-  * Returns a new array of segments that is the result of merging
-  * properties from an older list of segments onto an updated
-  * list. No properties on the updated playlist will be overridden.
-  *
-  * @param {Array} original the outdated list of segments
-  * @param {Array} update the updated list of segments
-  * @param {number=} offset the index of the first update
-  * segment in the original segment list. For non-live playlists,
-  * this should always be zero and does not need to be
-  * specified. For live playlists, it should be the difference
-  * between the media sequence numbers in the original and updated
-  * playlists.
-  * @return a list of merged segment objects
-  */
+ * Returns a new segment object with properties and
+ * the parts array merged.
+ *
+ * @param {Object} a the old segment
+ * @param {Object} b the new segment
+ *
+ * @return {Object} the merged segment
+ */
+export const updateSegment = (a, b) => {
+  if (!a) {
+    return b;
+  }
+
+  const result = mergeOptions(a, b);
+
+  // if only the old segment has parts
+  // then the parts are no longer valid
+  if (a.parts && !b.parts) {
+    delete result.parts;
+  // if both segments have parts
+  // copy part propeties from the old segment
+  // to the new one.
+  } else if (a.parts && b.parts) {
+    for (let i = 0; i < b.parts.length; i++) {
+      if (a.parts && a.parts[i]) {
+        result.parts[i] = mergeOptions(a.parts[i], b.parts[i]);
+      }
+    }
+  }
+
+  return result;
+};
+
+/**
+ * Returns a new array of segments that is the result of merging
+ * properties from an older list of segments onto an updated
+ * list. No properties on the updated playlist will be ovewritten.
+ *
+ * @param {Array} original the outdated list of segments
+ * @param {Array} update the updated list of segments
+ * @param {number=} offset the index of the first update
+ * segment in the original segment list. For non-live playlists,
+ * this should always be zero and does not need to be
+ * specified. For live playlists, it should be the difference
+ * between the media sequence numbers in the original and updated
+ * playlists.
+ * @return {Array} a list of merged segment objects
+ */
 export const updateSegments = (original, update, offset) => {
+  const oldSegments = original.slice();
   const result = update.slice();
 
   offset = offset || 0;
   const length = Math.min(original.length, update.length + offset);
 
   for (let i = offset; i < length; i++) {
-    result[i - offset] = mergeOptions(original[i], result[i - offset]);
+    const newIndex = i - offset;
+
+    result[newIndex] = updateSegment(oldSegments[i], result[newIndex]);
   }
   return result;
 };
 
 export const resolveSegmentUris = (segment, baseUri) => {
-  if (!segment.resolvedUri) {
+  // preloadSegments will not have a uri at all
+  // as the segment isn't actually in the manifest yet, only parts
+  if (!segment.resolvedUri && segment.uri) {
     segment.resolvedUri = resolveUrl(baseUri, segment.uri);
   }
   if (segment.key && !segment.key.resolvedUri) {
@@ -55,6 +94,23 @@ export const resolveSegmentUris = (segment, baseUri) => {
   if (segment.map && !segment.map.resolvedUri) {
     segment.map.resolvedUri = resolveUrl(baseUri, segment.map.uri);
   }
+  if (segment.parts && segment.parts.length) {
+    segment.parts.forEach((p) => {
+      if (p.resolvedUri) {
+        return;
+      }
+      p.resolvedUri = resolveUrl(baseUri, p.uri);
+    });
+  }
+
+  if (segment.preloadHints && segment.preloadHints.length) {
+    segment.preloadHints.forEach((p) => {
+      if (p.resolvedUri) {
+        return;
+      }
+      p.resolvedUri = resolveUrl(baseUri, p.uri);
+    });
+  }
 };
 
 // consider the playlist unchanged if the playlist object is the same or
@@ -173,6 +229,7 @@ export default class PlaylistLoader extends EventTarget {
 
     this.customTagParsers = (vhsOptions && vhsOptions.customTagParsers) || [];
     this.customTagMappers = (vhsOptions && vhsOptions.customTagMappers) || [];
+    this.experimentalLLHLS = (vhsOptions && vhsOptions.experimentalLLHLS) || false;
 
     // initialize the loader state
     this.state = 'HAVE_NOTHING';
@@ -254,7 +311,8 @@ export default class PlaylistLoader extends EventTarget {
       oninfo: ({message}) => this.logger_(`m3u8-parser info for ${id}: ${message}`),
       manifestString: playlistString,
       customTagParsers: this.customTagParsers,
-      customTagMappers: this.customTagMappers
+      customTagMappers: this.customTagMappers,
+      experimentalLLHLS: this.experimentalLLHLS
     });
 
     playlist.lastRequest = Date.now();
@@ -562,7 +620,8 @@ export default class PlaylistLoader extends EventTarget {
       const manifest = parseManifest({
         manifestString: req.responseText,
         customTagParsers: this.customTagParsers,
-        customTagMappers: this.customTagMappers
+        customTagMappers: this.customTagMappers,
+        llhls: this.llhls
       });
 
       this.setupInitialPlaylist(manifest);
diff --git a/src/segment-loader.js b/src/segment-loader.js
index 9fec008bb..490f3c7f8 100644
--- a/src/segment-loader.js
+++ b/src/segment-loader.js
@@ -461,6 +461,7 @@ export default class SegmentLoader extends videojs.EventTarget {
     this.roundTrip = NaN;
     this.resetStats_();
     this.mediaIndex = null;
+    this.partIndex = null;
 
     // private settings
     this.hasPlayed_ = settings.hasPlayed;
@@ -988,6 +989,31 @@ export default class SegmentLoader extends videojs.EventTarget {
     // equal to the last appended mediaIndex
     if (this.mediaIndex !== null) {
       this.mediaIndex -= mediaSequenceDiff;
+
+      // this can happen if we are going to load the first segment, but get a playlist
+      // update during that. mediaIndex would go from 0 to -1 if mediaSequence in the
+      // new playlist was incremented by 1.
+      if (this.mediaIndex < 0) {
+        this.mediaIndex = null;
+        this.partIndex = null;
+      } else {
+        const segment = this.playlist_.segments[this.mediaIndex];
+
+        // partIndex should remain the same for the same segment
+        // unless parts fell off of the playlist for this segment.
+        // In that case we need to reset partIndex and resync
+        if (this.partIndex && (!segment.parts || !segment.parts.length || !segment.parts[this.partIndex])) {
+          const mediaIndex = this.mediaIndex;
+
+          this.logger_(`currently processing part (index ${this.partIndex}) no longer exists.`);
+          this.resetLoader();
+
+          // We want to throw away the partIndex and the data associated with it,
+          // as the part was dropped from our current playlists segment.
+          // The mediaIndex will still be valid so keep that around.
+          this.mediaIndex = mediaIndex;
+        }
+      }
     }
 
     // update the mediaIndex on the SegmentInfo object
@@ -996,11 +1022,20 @@ export default class SegmentLoader extends videojs.EventTarget {
     if (segmentInfo) {
       segmentInfo.mediaIndex -= mediaSequenceDiff;
 
-      // we need to update the referenced segment so that timing information is
-      // saved for the new playlist's segment, however, if the segment fell off the
-      // playlist, we can leave the old reference and just lose the timing info
-      if (segmentInfo.mediaIndex >= 0) {
-        segmentInfo.segment = newPlaylist.segments[segmentInfo.mediaIndex];
+      if (segmentInfo.mediaIndex < 0) {
+        segmentInfo.mediaIndex = null;
+        segmentInfo.partIndex = null;
+      } else {
+        // we need to update the referenced segment so that timing information is
+        // saved for the new playlist's segment, however, if the segment fell off the
+        // playlist, we can leave the old reference and just lose the timing info
+        if (segmentInfo.mediaIndex >= 0) {
+          segmentInfo.segment = newPlaylist.segments[segmentInfo.mediaIndex];
+        }
+
+        if (segmentInfo.partIndex >= 0 && segmentInfo.segment.parts) {
+          segmentInfo.part = segmentInfo.segment.parts[segmentInfo.partIndex];
+        }
       }
     }
 
@@ -1078,6 +1113,7 @@ export default class SegmentLoader extends videojs.EventTarget {
       segmentTransmuxer.reset(this.transmuxer_);
     }
     this.mediaIndex = null;
+    this.partIndex = null;
     this.syncPoint_ = null;
     this.isPendingTimestampOffset_ = false;
     this.callQueue_ = [];
@@ -1223,7 +1259,8 @@ export default class SegmentLoader extends videojs.EventTarget {
       this.mediaIndex,
       this.hasPlayed_(),
       this.currentTime_(),
-      this.syncPoint_
+      this.syncPoint_,
+      this.partIndex
     );
 
     if (!segmentInfo) {
@@ -1259,18 +1296,25 @@ export default class SegmentLoader extends videojs.EventTarget {
    * @param {Object} [playlist] a media playlist object
    * @return {boolean} do we need to call endOfStream on the MediaSource
    */
-  isEndOfStream_(mediaIndex = this.mediaIndex, playlist = this.playlist_) {
+  isEndOfStream_(mediaIndex = this.mediaIndex, playlist = this.playlist_, partIndex = this.partIndex) {
     if (!playlist || !this.mediaSource_) {
       return false;
     }
 
+    const segment = typeof mediaIndex === 'number' && playlist.segments[mediaIndex];
+
     // mediaIndex is zero based but length is 1 based
     const appendedLastSegment = (mediaIndex + 1) === playlist.segments.length;
+    // true if there are no parts, or this is the last part.
+    const appendedLastPart = !segment || !segment.parts || (partIndex + 1) === segment.parts.length;
 
     // if we've buffered to the end of the video, we need to call endOfStream
     // so that MediaSources can trigger the `ended` event when it runs out of
     // buffered data instead of waiting for me
-    return playlist.endList && this.mediaSource_.readyState === 'open' && appendedLastSegment;
+    return playlist.endList &&
+      this.mediaSource_.readyState === 'open' &&
+      appendedLastSegment &&
+      appendedLastPart;
   }
 
   /**
@@ -1285,7 +1329,7 @@ export default class SegmentLoader extends videojs.EventTarget {
    * @param {Object} syncPoint - a segment info object that describes the
    * @return {Object} a segment request object that describes the segment to load
    */
-  checkBuffer_(buffered, playlist, currentMediaIndex, hasPlayed, currentTime, syncPoint) {
+  checkBuffer_(buffered, playlist, currentMediaIndex, hasPlayed, currentTime, syncPoint, currentPartIndex) {
     let lastBufferedEnd = 0;
 
     if (buffered.length) {
@@ -1310,6 +1354,7 @@ export default class SegmentLoader extends videojs.EventTarget {
       return null;
     }
 
+    let nextPartIndex = typeof currentPartIndex === 'number' ? currentPartIndex + 1 : 0;
     let nextMediaIndex = null;
     let startOfSegment;
     let isSyncRequest = false;
@@ -1325,14 +1370,15 @@ export default class SegmentLoader extends videojs.EventTarget {
     // Under normal playback conditions fetching is a simple walk forward
       const segment = playlist.segments[currentMediaIndex];
 
-      if (segment && segment.end) {
-        startOfSegment = segment.end;
+      startOfSegment = segment.end ? segment.end : lastBufferedEnd;
+
+      if (!segment.parts || !segment.parts.length || !segment.parts[nextPartIndex]) {
+        nextMediaIndex = currentMediaIndex + 1;
+        nextPartIndex = 0;
       } else {
-        startOfSegment = lastBufferedEnd;
+        nextMediaIndex = currentMediaIndex;
       }
 
-      nextMediaIndex = currentMediaIndex + 1;
-
     // There is a sync-point but the lack of a mediaIndex indicates that
     // we need to make a good conservative guess about which segment to
     // fetch
@@ -1360,7 +1406,7 @@ export default class SegmentLoader extends videojs.EventTarget {
       startOfSegment = mediaSourceInfo.startTime;
     }
 
-    const segmentInfo = this.generateSegmentInfo_(playlist, nextMediaIndex, startOfSegment, isSyncRequest);
+    const segmentInfo = this.generateSegmentInfo_(playlist, nextMediaIndex, startOfSegment, isSyncRequest, nextPartIndex);
 
     if (!segmentInfo) {
       return;
@@ -1402,12 +1448,8 @@ export default class SegmentLoader extends videojs.EventTarget {
     }
 
     const segmentIndexArray = playlist.segments
-      .map((s, i) => {
-        return {
-          timeline: s.timeline,
-          segmentIndex: i
-        };
-      }).filter(s => s.timeline === this.currentTimeline_);
+      .map((s, i) => ({timeline: s.timeline, segmentIndex: i}))
+      .filter(s => s.timeline === this.currentTimeline_);
 
     if (segmentIndexArray.length) {
       return segmentIndexArray[Math.min(segmentIndexArray.length - 1, 1)].segmentIndex;
@@ -1416,12 +1458,19 @@ export default class SegmentLoader extends videojs.EventTarget {
     return Math.max(playlist.segments.length - 1, 0);
   }
 
-  generateSegmentInfo_(playlist, mediaIndex, startOfSegment, isSyncRequest) {
+  generateSegmentInfo_(playlist, mediaIndex, startOfSegment, isSyncRequest, partIndex) {
     if (mediaIndex < 0 || mediaIndex >= playlist.segments.length) {
       return null;
     }
 
     const segment = playlist.segments[mediaIndex];
+
+    if (segment.parts && segment.parts.length && partIndex >= segment.parts.length) {
+      return null;
+    }
+
+    const part = segment.parts && segment.parts.length && segment.parts[partIndex];
+
     const audioBuffered = this.sourceUpdater_.audioBuffered();
     const videoBuffered = this.sourceUpdater_.videoBuffered();
     let audioAppendStart;
@@ -1447,9 +1496,10 @@ export default class SegmentLoader extends videojs.EventTarget {
     return {
       requestId: 'segment-loader-' + Math.random(),
       // resolve the segment URL relative to the playlist
-      uri: segment.resolvedUri,
+      uri: part && part.resolvedUri || segment.resolvedUri,
       // the segment's mediaIndex at the time it was requested
       mediaIndex,
+      partIndex: part ? partIndex : null,
       // whether or not to update the SegmentLoader's state with this
       // segment's mediaIndex
       isSyncRequest,
@@ -1469,6 +1519,7 @@ export default class SegmentLoader extends videojs.EventTarget {
       duration: segment.duration,
       // retain the segment in case the playlist updates while doing an async process
       segment,
+      part,
       byteLength: 0,
       transmuxer: this.transmuxer_,
       audioAppendStart,
@@ -2333,7 +2384,11 @@ export default class SegmentLoader extends videojs.EventTarget {
     }
 
     const simpleSegment = this.createSimplifiedSegmentObj_(segmentInfo);
-    const isEndOfStream = this.isEndOfStream_(segmentInfo.mediaIndex, segmentInfo.playlist);
+    const isEndOfStream = this.isEndOfStream_(
+      segmentInfo.mediaIndex,
+      segmentInfo.playlist,
+      segmentInfo.partIndex
+    );
     const isWalkingForward = this.mediaIndex !== null;
     const isDiscontinuity = segmentInfo.timeline !== this.currentTimeline_ &&
       // currentTimeline starts at -1, so we shouldn't end the timeline switching to 0,
@@ -2402,13 +2457,16 @@ export default class SegmentLoader extends videojs.EventTarget {
    */
   createSimplifiedSegmentObj_(segmentInfo) {
     const segment = segmentInfo.segment;
+    const part = segmentInfo.part;
+
     const simpleSegment = {
-      resolvedUri: segment.resolvedUri,
-      byterange: segment.byterange,
+      resolvedUri: part ? part.resolvedUri : segment.resolvedUri,
+      byterange: part ? part.byterange : segment.byterange,
       requestId: segmentInfo.requestId,
       transmuxer: segmentInfo.transmuxer,
       audioAppendStart: segmentInfo.audioAppendStart,
-      gopsToAlignWith: segmentInfo.gopsToAlignWith
+      gopsToAlignWith: segmentInfo.gopsToAlignWith,
+      part: segmentInfo.part
     };
 
     const previousSegment = segmentInfo.playlist.segments[segmentInfo.mediaIndex - 1];
@@ -2918,11 +2976,12 @@ export default class SegmentLoader extends videojs.EventTarget {
     this.trigger('progress');
 
     this.mediaIndex = segmentInfo.mediaIndex;
+    this.partIndex = segmentInfo.partIndex;
 
     // any time an update finishes and the last segment is in the
     // buffer, end the stream. this ensures the "ended" event will
     // fire if playback reaches that point.
-    if (this.isEndOfStream_(segmentInfo.mediaIndex, segmentInfo.playlist)) {
+    if (this.isEndOfStream_(segmentInfo.mediaIndex, segmentInfo.playlist, segmentInfo.partIndex)) {
       this.endOfStream();
     }
 
diff --git a/src/videojs-http-streaming.js b/src/videojs-http-streaming.js
index fa656f1a4..96ee1c477 100644
--- a/src/videojs-http-streaming.js
+++ b/src/videojs-http-streaming.js
@@ -665,7 +665,8 @@ class VhsHandler extends Component {
       'playlistSelector',
       'initialPlaylistSelector',
       'experimentalBufferBasedABR',
-      'liveRangeSafeTimeDelta'
+      'liveRangeSafeTimeDelta',
+      'experimentalLLHLS'
     ].forEach((option) => {
       if (typeof this.source_[option] !== 'undefined') {
         this.options_[option] = this.source_[option];
diff --git a/test/loader-common.js b/test/loader-common.js
index 874e9da3b..552892544 100644
--- a/test/loader-common.js
+++ b/test/loader-common.js
@@ -120,6 +120,26 @@ export const LoaderCommonFactory = ({
 }) => {
   let loader;
 
+  const appendPart = function(segmentIndex, partIndex) {
+    this.clock.tick(1);
+
+    QUnit.assert.equal(
+      this.requests[0].url,
+      `segment${segmentIndex}.part${partIndex}.ts`,
+      `requested mediaIndex #${segmentIndex} partIndex #${partIndex}`
+    );
+    standardXHRResponse(this.requests.shift(), testData());
+
+    if (usesAsyncAppends) {
+      return new Promise((resolve, reject) => {
+        loader.one('appended', resolve);
+        loader.one('error', reject);
+      });
+    }
+
+    return Promise.resolve();
+  };
+
   QUnit.module('Loader Common', function(hooks) {
     hooks.beforeEach(function(assert) {
       // Assume this module is nested and the parent module uses CommonHooks.beforeEach
@@ -802,6 +822,93 @@ export const LoaderCommonFactory = ({
       });
     });
 
+    // only main/fmp4 segment loaders use parts/partIndex
+    if (usesAsyncAppends) {
+      QUnit.test('mediaIndex and partIndex are used', function(assert) {
+
+        return setupMediaSource(loader.mediaSource_, loader.sourceUpdater_).then(() => {
+          loader.playlist(playlistWithDuration(50, {
+            mediaSequence: 0,
+            endList: false,
+            llhls: true
+          }));
+
+          loader.load();
+          loader.mediaIndex = 2;
+          return Promise.resolve();
+        }).then(() => appendPart.call(this, 2, 0))
+          .then(() => appendPart.call(this, 2, 1))
+          .then(() => appendPart.call(this, 2, 2))
+          .then(() => appendPart.call(this, 2, 3))
+          .then(() => appendPart.call(this, 2, 4))
+          .then(() => appendPart.call(this, 3, 0));
+      });
+
+      QUnit.test('mediaIndex and partIndex survive playlist change', function(assert) {
+        return setupMediaSource(loader.mediaSource_, loader.sourceUpdater_).then(() => {
+          loader.playlist(playlistWithDuration(50, {
+            mediaSequence: 0,
+            endList: false,
+            llhls: true
+          }));
+
+          loader.load();
+          loader.mediaIndex = 4;
+          return Promise.resolve();
+        }).then(() => appendPart.call(this, 4, 0))
+          .then(() => appendPart.call(this, 4, 1))
+          .then(() => appendPart.call(this, 4, 2))
+          .then(() => {
+
+            // Update the playlist shifting the mediaSequence by 2 which will result
+            // in a decrement of the mediaIndex by 2 to 1
+            loader.playlist(playlistWithDuration(50, {
+              mediaSequence: 2,
+              endList: false,
+              llhls: true
+            }));
+            // verify that we still try to append the next part for that segment.
+            return appendPart.call(this, 2, 3);
+          }).then(() => appendPart.call(this, 2, 4));
+      });
+
+      QUnit.test('drops partIndex if playlist update drops parts', function(assert) {
+        assert.timeout(100000000000000000000);
+        return setupMediaSource(loader.mediaSource_, loader.sourceUpdater_).then(() => {
+          loader.playlist(playlistWithDuration(50, {
+            mediaSequence: 0,
+            endList: false,
+            llhls: true
+          }));
+
+          loader.load();
+          loader.mediaIndex = 4;
+          return Promise.resolve();
+        }).then(() => appendPart.call(this, 4, 0))
+          .then(() => appendPart.call(this, 4, 1))
+          .then(() => appendPart.call(this, 4, 2))
+          .then(() => {
+
+            // Update the playlist shifting the mediaSequence by 4 which will result
+            // in a decrement of the mediaIndex by 4 to 0
+            loader.playlist(playlistWithDuration(50, {
+              mediaSequence: 4,
+              endList: false,
+              llhls: true
+            }));
+
+            assert.equal(loader.partIndex, null, 'partIndex was dropped');
+            this.clock.tick(1);
+
+            assert.equal(
+              this.requests[0].url,
+              '1.ts',
+              'requested mediaIndex 1 only'
+            );
+          });
+      });
+    }
+
     QUnit.test('segment 404s should trigger an error', function(assert) {
       const errors = [];
 
diff --git a/test/segment-loader.test.js b/test/segment-loader.test.js
index 25b004ada..ba36f9d10 100644
--- a/test/segment-loader.test.js
+++ b/test/segment-loader.test.js
@@ -1004,6 +1004,7 @@ QUnit.module('SegmentLoader', function(hooks) {
         this.clock.tick(1);
 
         assert.equal(loader.mediaIndex, null, 'mediaIndex reset by seek to seekable');
+        assert.equal(loader.partIndex, null, 'partIndex reset by seek to seekable');
         assert.equal(syncInfoUpdates, 1, 'syncinfoupdate was triggered');
       });
     });
diff --git a/test/test-helpers.js b/test/test-helpers.js
index 2c3c39c9e..14cbb7f96 100644
--- a/test/test-helpers.js
+++ b/test/test-helpers.js
@@ -432,10 +432,14 @@ export const playlistWithDuration = function(time, conf) {
     attributes: conf && typeof conf.attributes !== 'undefined' ? conf.attributes : {}
   };
 
+  if (conf && conf.llhls) {
+    result.partTargetDuration = conf.llhls.partTargetDuration || (targetDuration / 5);
+  }
+
   result.id = result.uri;
 
-  const count = Math.floor(time / targetDuration);
   const remainder = time % targetDuration;
+  const count = Math.floor(time / targetDuration) + (remainder ? 1 : 0);
   let i;
   const isEncrypted = conf && conf.isEncrypted;
   const extension = conf && conf.extension ? conf.extension : '.ts';
@@ -454,7 +458,8 @@ export const playlistWithDuration = function(time, conf) {
     const segment = {
       uri: i + extension,
       resolvedUri: i + extension,
-      duration: targetDuration,
+      // last segment will be less then 10 if duration is uneven
+      duration: (i + 1 === count && remainder) ? remainder : targetDuration,
       timeline
     };
 
@@ -469,15 +474,26 @@ export const playlistWithDuration = function(time, conf) {
       segment.discontinuity = true;
     }
 
+    // add parts for the the last 3 segments in llhls playlists
+    if (conf && conf.llhls && (count - i) <= 3) {
+      segment.parts = [];
+      const partRemainder = segment.duration % result.partTargetDuration;
+      const partCount = Math.floor(segment.duration / result.partTargetDuration) + (partRemainder ? 1 : 0);
+
+      for (let z = 0; z < partCount; z++) {
+        const uri = `segment${i}.part${z}${extension}`;
+
+        segment.parts.push({
+          uri,
+          resolvedUri: uri,
+          duration: (z + 1 === partCount && partRemainder) ? partRemainder : result.partTargetDuration
+        });
+      }
+    }
+
     result.segments.push(segment);
   }
-  if (remainder) {
-    result.segments.push({
-      uri: i + extension,
-      duration: remainder,
-      timeline: result.discontinuitySequence
-    });
-  }
+
   return result;
 };