Update node modules

node_modules/@videojs/http-streaming/CHANGELOG.md

@@ -1,3 +1,19 @@
+<a name="3.13.2"></a>
+## [3.13.2](https://github.com/videojs/http-streaming/compare/v3.13.1...v3.13.2) (2024-07-22)
+
+### Bug Fixes
+
+* bad timeline changes ([#1526](https://github.com/videojs/http-streaming/issues/1526)) ([7c63f4e](https://github.com/videojs/http-streaming/commit/7c63f4e))
+* fastQualitySwitch stability ([#1525](https://github.com/videojs/http-streaming/issues/1525)) ([28cb9fd](https://github.com/videojs/http-streaming/commit/28cb9fd))
+* remove extra abort call ([#1528](https://github.com/videojs/http-streaming/issues/1528)) ([7ec606f](https://github.com/videojs/http-streaming/commit/7ec606f))
+* videoTimestampOffset in sourceUpdater ([#1519](https://github.com/videojs/http-streaming/issues/1519)) ([d6851cc](https://github.com/videojs/http-streaming/commit/d6851cc))
+
+### Chores
+
+* Add log export to the demo page ([#1522](https://github.com/videojs/http-streaming/issues/1522)) ([0b4da7c](https://github.com/videojs/http-streaming/commit/0b4da7c))
+* Switch to our quality selector ([#1527](https://github.com/videojs/http-streaming/issues/1527)) ([e3d1c42](https://github.com/videojs/http-streaming/commit/e3d1c42))
+* Update codecov action ([#1523](https://github.com/videojs/http-streaming/issues/1523)) ([bb9133c](https://github.com/videojs/http-streaming/commit/bb9133c))
+
 <a name="3.13.1"></a>
 ## [3.13.1](https://github.com/videojs/http-streaming/compare/v3.13.0...v3.13.1) (2024-06-12)
 

node_modules/@videojs/http-streaming/dist/videojs-http-streaming-sync-workers.js

@@ -1,4 +1,4 @@
-/*! @name @videojs/http-streaming @version 3.13.1 @license Apache-2.0 */
+/*! @name @videojs/http-streaming @version 3.13.2 @license Apache-2.0 */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('video.js'), require('@xmldom/xmldom')) :
   typeof define === 'function' && define.amd ? define(['exports', 'video.js', '@xmldom/xmldom'], factory) :
@@ -23328,6 +23328,36 @@
 
     return false;
   };
+  const shouldFixBadTimelineChanges = timelineChangeController => {
+    if (!timelineChangeController) {
+      return false;
+    }
+
+    const pendingAudioTimelineChange = timelineChangeController.pendingTimelineChange({
+      type: 'audio'
+    });
+    const pendingMainTimelineChange = timelineChangeController.pendingTimelineChange({
+      type: 'main'
+    });
+    const hasPendingTimelineChanges = pendingAudioTimelineChange && pendingMainTimelineChange;
+    const differentPendingChanges = hasPendingTimelineChanges && pendingAudioTimelineChange.to !== pendingMainTimelineChange.to;
+    const isNotInitialPendingTimelineChange = hasPendingTimelineChanges && pendingAudioTimelineChange.from !== -1 && pendingMainTimelineChange.from !== -1;
+
+    if (isNotInitialPendingTimelineChange && differentPendingChanges) {
+      return true;
+    }
+
+    return false;
+  };
+  const fixBadTimelineChange = segmentLoader => {
+    if (!segmentLoader) {
+      return;
+    }
+
+    segmentLoader.pause();
+    segmentLoader.resetEverything();
+    segmentLoader.load();
+  };
   const mediaDuration = timingInfos => {
     let maxDuration = 0;
     ['video', 'audio'].forEach(function (type) {
@@ -25016,6 +25046,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
         loaderType: this.loaderType_,
         audioDisabled: this.audioDisabled_
       })) {
+        if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+          fixBadTimelineChange(this);
+        }
+
         return false;
       }
 
@@ -25067,7 +25101,8 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
 
       if (hasAudio && !this.audioDisabled_ && !isMuxed && !segmentInfo.audioTimingInfo) {
         return false;
-      }
+      } // we need to allow an append here even if we're moving to different timelines.
+
 
       if (shouldWaitForTimelineChange({
         timelineChangeController: this.timelineChangeController_,
@@ -25076,6 +25111,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
         loaderType: this.loaderType_,
         audioDisabled: this.audioDisabled_
       })) {
+        if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+          fixBadTimelineChange(this);
+        }
+
         return false;
       }
 
@@ -27137,7 +27176,7 @@ ${segmentInfoString(segmentInfo)}`); // If there's an init segment associated wi
 
     videoTimestampOffset(offset) {
       if (typeof offset !== 'undefined' && this.videoBuffer && // no point in updating if it's the same
-      this.videoTimestampOffset !== offset) {
+      this.videoTimestampOffset_ !== offset) {
         pushQueue({
           type: 'video',
           sourceUpdater: this,
@@ -31916,16 +31955,11 @@ ${segmentInfoString(segmentInfo)}`); // If there's an init segment associated wi
     }
 
     runFastQualitySwitch_() {
-      this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch, then seek to give
-      // the browser a kick to remove any cached frames from the previous rendtion (.04 seconds
-      // ahead was roughly the minimum that will accomplish this across a variety of content
-      // in IE and Edge, but seeking in place is sufficient on all other browsers)
-      // Edge/IE bug: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/14600375/
-      // Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=651904
+      this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch.
 
       this.mainSegmentLoader_.pause();
       this.mainSegmentLoader_.resetEverything(() => {
-        this.tech_.setCurrentTime(this.tech_.currentTime());
+        this.mainSegmentLoader_.load();
       }); // don't need to reset audio as it is reset when media changes
     }
     /**
@@ -34250,7 +34284,7 @@ ${segmentInfoString(segmentInfo)}`); // If there's an init segment associated wi
     initPlugin(this, options);
   };
 
-  var version$4 = "3.13.1";
+  var version$4 = "3.13.2";
 
   var version$3 = "7.0.3";
 

node_modules/@videojs/http-streaming/dist/videojs-http-streaming.cjs.js

@@ -1,4 +1,4 @@
-/*! @name @videojs/http-streaming @version 3.13.1 @license Apache-2.0 */
+/*! @name @videojs/http-streaming @version 3.13.2 @license Apache-2.0 */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -17261,6 +17261,36 @@ const shouldWaitForTimelineChange = ({
 
   return false;
 };
+const shouldFixBadTimelineChanges = timelineChangeController => {
+  if (!timelineChangeController) {
+    return false;
+  }
+
+  const pendingAudioTimelineChange = timelineChangeController.pendingTimelineChange({
+    type: 'audio'
+  });
+  const pendingMainTimelineChange = timelineChangeController.pendingTimelineChange({
+    type: 'main'
+  });
+  const hasPendingTimelineChanges = pendingAudioTimelineChange && pendingMainTimelineChange;
+  const differentPendingChanges = hasPendingTimelineChanges && pendingAudioTimelineChange.to !== pendingMainTimelineChange.to;
+  const isNotInitialPendingTimelineChange = hasPendingTimelineChanges && pendingAudioTimelineChange.from !== -1 && pendingMainTimelineChange.from !== -1;
+
+  if (isNotInitialPendingTimelineChange && differentPendingChanges) {
+    return true;
+  }
+
+  return false;
+};
+const fixBadTimelineChange = segmentLoader => {
+  if (!segmentLoader) {
+    return;
+  }
+
+  segmentLoader.pause();
+  segmentLoader.resetEverything();
+  segmentLoader.load();
+};
 const mediaDuration = timingInfos => {
   let maxDuration = 0;
   ['video', 'audio'].forEach(function (type) {
@@ -18949,6 +18979,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
       loaderType: this.loaderType_,
       audioDisabled: this.audioDisabled_
     })) {
+      if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+        fixBadTimelineChange(this);
+      }
+
       return false;
     }
 
@@ -19000,7 +19034,8 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
 
     if (hasAudio && !this.audioDisabled_ && !isMuxed && !segmentInfo.audioTimingInfo) {
       return false;
-    }
+    } // we need to allow an append here even if we're moving to different timelines.
+
 
     if (shouldWaitForTimelineChange({
       timelineChangeController: this.timelineChangeController_,
@@ -19009,6 +19044,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
       loaderType: this.loaderType_,
       audioDisabled: this.audioDisabled_
     })) {
+      if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+        fixBadTimelineChange(this);
+      }
+
       return false;
     }
 
@@ -21070,7 +21109,7 @@ class SourceUpdater extends videojs__default["default"].EventTarget {
 
   videoTimestampOffset(offset) {
     if (typeof offset !== 'undefined' && this.videoBuffer && // no point in updating if it's the same
-    this.videoTimestampOffset !== offset) {
+    this.videoTimestampOffset_ !== offset) {
       pushQueue({
         type: 'video',
         sourceUpdater: this,
@@ -25849,16 +25888,11 @@ class PlaylistController extends videojs__default["default"].EventTarget {
   }
 
   runFastQualitySwitch_() {
-    this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch, then seek to give
-    // the browser a kick to remove any cached frames from the previous rendtion (.04 seconds
-    // ahead was roughly the minimum that will accomplish this across a variety of content
-    // in IE and Edge, but seeking in place is sufficient on all other browsers)
-    // Edge/IE bug: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/14600375/
-    // Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=651904
+    this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch.
 
     this.mainSegmentLoader_.pause();
     this.mainSegmentLoader_.resetEverything(() => {
-      this.tech_.setCurrentTime(this.tech_.currentTime());
+      this.mainSegmentLoader_.load();
     }); // don't need to reset audio as it is reset when media changes
   }
   /**
@@ -28183,7 +28217,7 @@ const reloadSourceOnError = function (options) {
   initPlugin(this, options);
 };
 
-var version$4 = "3.13.1";
+var version$4 = "3.13.2";
 
 var version$3 = "7.0.3";
 

node_modules/@videojs/http-streaming/dist/videojs-http-streaming.es.js

@@ -1,4 +1,4 @@
-/*! @name @videojs/http-streaming @version 3.13.1 @license Apache-2.0 */
+/*! @name @videojs/http-streaming @version 3.13.2 @license Apache-2.0 */
 import _extends from '@babel/runtime/helpers/extends';
 import document from 'global/document';
 import window$1 from 'global/window';
@@ -17249,6 +17249,36 @@ const shouldWaitForTimelineChange = ({
 
   return false;
 };
+const shouldFixBadTimelineChanges = timelineChangeController => {
+  if (!timelineChangeController) {
+    return false;
+  }
+
+  const pendingAudioTimelineChange = timelineChangeController.pendingTimelineChange({
+    type: 'audio'
+  });
+  const pendingMainTimelineChange = timelineChangeController.pendingTimelineChange({
+    type: 'main'
+  });
+  const hasPendingTimelineChanges = pendingAudioTimelineChange && pendingMainTimelineChange;
+  const differentPendingChanges = hasPendingTimelineChanges && pendingAudioTimelineChange.to !== pendingMainTimelineChange.to;
+  const isNotInitialPendingTimelineChange = hasPendingTimelineChanges && pendingAudioTimelineChange.from !== -1 && pendingMainTimelineChange.from !== -1;
+
+  if (isNotInitialPendingTimelineChange && differentPendingChanges) {
+    return true;
+  }
+
+  return false;
+};
+const fixBadTimelineChange = segmentLoader => {
+  if (!segmentLoader) {
+    return;
+  }
+
+  segmentLoader.pause();
+  segmentLoader.resetEverything();
+  segmentLoader.load();
+};
 const mediaDuration = timingInfos => {
   let maxDuration = 0;
   ['video', 'audio'].forEach(function (type) {
@@ -18937,6 +18967,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
       loaderType: this.loaderType_,
       audioDisabled: this.audioDisabled_
     })) {
+      if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+        fixBadTimelineChange(this);
+      }
+
       return false;
     }
 
@@ -18988,7 +19022,8 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
 
     if (hasAudio && !this.audioDisabled_ && !isMuxed && !segmentInfo.audioTimingInfo) {
       return false;
-    }
+    } // we need to allow an append here even if we're moving to different timelines.
+
 
     if (shouldWaitForTimelineChange({
       timelineChangeController: this.timelineChangeController_,
@@ -18997,6 +19032,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
       loaderType: this.loaderType_,
       audioDisabled: this.audioDisabled_
     })) {
+      if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+        fixBadTimelineChange(this);
+      }
+
       return false;
     }
 
@@ -21058,7 +21097,7 @@ class SourceUpdater extends videojs.EventTarget {
 
   videoTimestampOffset(offset) {
     if (typeof offset !== 'undefined' && this.videoBuffer && // no point in updating if it's the same
-    this.videoTimestampOffset !== offset) {
+    this.videoTimestampOffset_ !== offset) {
       pushQueue({
         type: 'video',
         sourceUpdater: this,
@@ -25837,16 +25876,11 @@ class PlaylistController extends videojs.EventTarget {
   }
 
   runFastQualitySwitch_() {
-    this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch, then seek to give
-    // the browser a kick to remove any cached frames from the previous rendtion (.04 seconds
-    // ahead was roughly the minimum that will accomplish this across a variety of content
-    // in IE and Edge, but seeking in place is sufficient on all other browsers)
-    // Edge/IE bug: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/14600375/
-    // Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=651904
+    this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch.
 
     this.mainSegmentLoader_.pause();
     this.mainSegmentLoader_.resetEverything(() => {
-      this.tech_.setCurrentTime(this.tech_.currentTime());
+      this.mainSegmentLoader_.load();
     }); // don't need to reset audio as it is reset when media changes
   }
   /**
@@ -28171,7 +28205,7 @@ const reloadSourceOnError = function (options) {
   initPlugin(this, options);
 };
 
-var version$4 = "3.13.1";
+var version$4 = "3.13.2";
 
 var version$3 = "7.0.3";
 

node_modules/@videojs/http-streaming/dist/videojs-http-streaming.js

@@ -1,4 +1,4 @@
-/*! @name @videojs/http-streaming @version 3.13.1 @license Apache-2.0 */
+/*! @name @videojs/http-streaming @version 3.13.2 @license Apache-2.0 */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('video.js'), require('@xmldom/xmldom')) :
   typeof define === 'function' && define.amd ? define(['exports', 'video.js', '@xmldom/xmldom'], factory) :
@@ -23278,6 +23278,36 @@
 
     return false;
   };
+  const shouldFixBadTimelineChanges = timelineChangeController => {
+    if (!timelineChangeController) {
+      return false;
+    }
+
+    const pendingAudioTimelineChange = timelineChangeController.pendingTimelineChange({
+      type: 'audio'
+    });
+    const pendingMainTimelineChange = timelineChangeController.pendingTimelineChange({
+      type: 'main'
+    });
+    const hasPendingTimelineChanges = pendingAudioTimelineChange && pendingMainTimelineChange;
+    const differentPendingChanges = hasPendingTimelineChanges && pendingAudioTimelineChange.to !== pendingMainTimelineChange.to;
+    const isNotInitialPendingTimelineChange = hasPendingTimelineChanges && pendingAudioTimelineChange.from !== -1 && pendingMainTimelineChange.from !== -1;
+
+    if (isNotInitialPendingTimelineChange && differentPendingChanges) {
+      return true;
+    }
+
+    return false;
+  };
+  const fixBadTimelineChange = segmentLoader => {
+    if (!segmentLoader) {
+      return;
+    }
+
+    segmentLoader.pause();
+    segmentLoader.resetEverything();
+    segmentLoader.load();
+  };
   const mediaDuration = timingInfos => {
     let maxDuration = 0;
     ['video', 'audio'].forEach(function (type) {
@@ -24966,6 +24996,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
         loaderType: this.loaderType_,
         audioDisabled: this.audioDisabled_
       })) {
+        if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+          fixBadTimelineChange(this);
+        }
+
         return false;
       }
 
@@ -25017,7 +25051,8 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
 
       if (hasAudio && !this.audioDisabled_ && !isMuxed && !segmentInfo.audioTimingInfo) {
         return false;
-      }
+      } // we need to allow an append here even if we're moving to different timelines.
+
 
       if (shouldWaitForTimelineChange({
         timelineChangeController: this.timelineChangeController_,
@@ -25026,6 +25061,10 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
         loaderType: this.loaderType_,
         audioDisabled: this.audioDisabled_
       })) {
+        if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+          fixBadTimelineChange(this);
+        }
+
         return false;
       }
 
@@ -27087,7 +27126,7 @@ ${segmentInfoString(segmentInfo)}`); // If there's an init segment associated wi
 
     videoTimestampOffset(offset) {
       if (typeof offset !== 'undefined' && this.videoBuffer && // no point in updating if it's the same
-      this.videoTimestampOffset !== offset) {
+      this.videoTimestampOffset_ !== offset) {
         pushQueue({
           type: 'video',
           sourceUpdater: this,
@@ -31866,16 +31905,11 @@ ${segmentInfoString(segmentInfo)}`); // If there's an init segment associated wi
     }
 
     runFastQualitySwitch_() {
-      this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch, then seek to give
-      // the browser a kick to remove any cached frames from the previous rendtion (.04 seconds
-      // ahead was roughly the minimum that will accomplish this across a variety of content
-      // in IE and Edge, but seeking in place is sufficient on all other browsers)
-      // Edge/IE bug: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/14600375/
-      // Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=651904
+      this.waitingForFastQualityPlaylistReceived_ = false; // Delete all buffered data to allow an immediate quality switch.
 
       this.mainSegmentLoader_.pause();
       this.mainSegmentLoader_.resetEverything(() => {
-        this.tech_.setCurrentTime(this.tech_.currentTime());
+        this.mainSegmentLoader_.load();
       }); // don't need to reset audio as it is reset when media changes
     }
     /**
@@ -34200,7 +34234,7 @@ ${segmentInfoString(segmentInfo)}`); // If there's an init segment associated wi
     initPlugin(this, options);
   };
 
-  var version$4 = "3.13.1";
+  var version$4 = "3.13.2";
 
   var version$3 = "7.0.3";
 

node_modules/@videojs/http-streaming/index.html

@@ -6,7 +6,7 @@
   <link rel="icon" href="logo.svg">
   <link href="node_modules/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
   <link href="node_modules/video.js/dist/video-js.css" rel="stylesheet">
-  <link href="node_modules/jb-videojs-hls-quality-selector/dist/videojs-hls-quality-selector.css" rel="stylesheet">
+  <link rel="stylesheet" href="node_modules/videojs-contrib-quality-menu/dist/videojs-contrib-quality-menu.css">
   <style>
     .form-check {
       background-color: hsl(0, 0%, 90%);
@@ -24,6 +24,11 @@
     #segment-metadata pre {
       overflow: scroll;
     }
+    button.btn-outline-secondary:hover svg,
+    button.btn-success svg,
+    button.btn-danger svg {
+      fill: white;
+    }
   </style>
 </head>
 <body class="m-4">
@@ -52,6 +57,9 @@
     <li class="nav-item" role="presentation">
       <button class="nav-link" id="profile-tab" data-bs-toggle="tab" data-bs-target="#content-steering" type="button" role="tab" aria-selected="false">Content Steering</button>
     </li>
+    <li class="nav-item" role="presentation">
+      <button class="nav-link" id="profile-tab" data-bs-toggle="tab" data-bs-target="#export-logs" type="button" role="tab" aria-selected="false">Logs</button>
+    </li>
   </ul>
 
   <div class="tab-content container-fluid">
@@ -238,6 +246,30 @@
           </dl>
         </div>
       </div>
+    </div>
+
+    <div class="tab-pane" id="export-logs" role="historypanel">
+      <div class="row">
+        <div class="export-logs col-8">
+          <p>Download or copy the player logs, which should be included when submitting a playback issue.</p>
+          <p>To insert a comment into the player log, use <code>player.log()</code> in the console, e.g. <code>player.log('Seeking to 500');player.currentTime(500);</code></p>
+          <button id="download-logs" class="btn btn-outline-secondary">
+            <span class="icon">
+              <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368">
+               <path d="M480-320 280-520l56-58 104 104v-326h80v326l104-104 56 58-200 200ZM240-160q-33 0-56.5-23.5T160-240v-120h80v120h480v-120h80v120q0 33-23.5 56.5T720-160H240Z"/>
+             </svg>
+           </span>
+           Download player logs
+          </button>
+          <button id="copy-logs" class="btn btn-outline-secondary">
+            <span class="icon">
+              <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="#5f6368">
+                <path d="M360-240q-33 0-56.5-23.5T280-320v-480q0-33 23.5-56.5T360-880h360q33 0 56.5 23.5T800-800v480q0 33-23.5 56.5T720-240H360Zm0-80h360v-480H360v480ZM200-80q-33 0-56.5-23.5T120-160v-560h80v560h440v80H200Zm160-240v-480 480Z"/>
+              </svg>
+            </span>
+            Copy player logs to clipboard
+          </button>
+        </div>
       </div>
     </div>
   </div>

node_modules/@videojs/http-streaming/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@videojs/http-streaming",
-  "version": "3.13.1",
+  "version": "3.13.2",
   "description": "Play back HLS and DASH with Video.js, even where it's not natively supported",
   "main": "dist/videojs-http-streaming.cjs.js",
   "module": "dist/videojs-http-streaming.es.js",
@@ -77,7 +77,6 @@
     "@videojs/generator-helpers": "~3.1.0",
     "bootstrap": "^5.1.0",
     "d3": "^3.4.8",
-    "jb-videojs-hls-quality-selector": "^2.0.2",
     "jsdoc": "^3.6.11",
     "karma": "^6.4.0",
     "lodash": "^4.17.4",
@@ -90,6 +89,7 @@
     "url-toolkit": "^2.2.1",
     "videojs-contrib-eme": "^5.3.1",
     "videojs-contrib-quality-levels": "^4.0.0",
+    "videojs-contrib-quality-menu": "^1.0.3",
     "videojs-generate-karma-config": "^8.0.1",
     "videojs-generate-rollup-config": "^7.0.0",
     "videojs-generator-verify": "~3.0.1",

node_modules/@videojs/http-streaming/scripts/index.js

@@ -559,7 +559,7 @@
         'node_modules/video.js/dist/alt/video.core',
         'node_modules/videojs-contrib-eme/dist/videojs-contrib-eme',
         'node_modules/videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels',
-        'node_modules/jb-videojs-hls-quality-selector/dist/jb-videojs-hls-quality-selector'
+        'node_modules/videojs-contrib-quality-menu/dist/videojs-contrib-quality-menu'
 
       ].map(function(url) {
         return url + (event.target.checked ? '.min' : '') + '.js';
@@ -595,9 +595,7 @@
 
         player = window.player = window.videojs(videoEl, {
           plugins: {
-            hlsQualitySelector: {
-              displayCurrentQuality: true
-            }
+            qualityMenu: {}
           },
           liveui: stateEls.liveui.checked,
           enableSourceset: mirrorSource,
@@ -769,5 +767,75 @@
 
     // run the change handler for the first time
     stateEls.minified.dispatchEvent(newEvent('change'));
+
+    // Setup the download / copy log buttons
+    const downloadLogsButton = document.getElementById('download-logs');
+    const copyLogsButton = document.getElementById('copy-logs');
+
+    /**
+     * Window location and history joined with line breaks, stringifying any objects
+     *
+     * @return {string} Stringified history
+     */
+    const stringifiedLogHistory = () => {
+      const player = document.querySelector('video-js').player;
+      const logs = [].concat(player.log.history());
+      const withVhs = !!player.tech(true).vhs;
+
+      return [
+        window.location.href,
+        window.navigator.userAgent,
+        `Video.js ${window.videojs.VERSION}`,
+        `Using VHS: ${withVhs}`,
+        withVhs ? JSON.stringify(player.tech(true).vhs.version()) : ''
+      ].concat(logs.map(entryArgs => {
+        return entryArgs.map(item => {
+          return typeof item === 'object' ? JSON.stringify(item) : item;
+        });
+      })).join('\n');
+    };
+
+    /**
+     * Turn a bootstrap button class on briefly then revert to btn-outline-ptimary
+     *
+     * @param {HTMLElement} el Element to add class to
+     * @param {string} stateClass Bootstrap button class suffix
+     */
+    const doneFeedback = (el, stateClass) => {
+      el.classList.add(`btn-${stateClass}`);
+      el.classList.remove('btn-outline-secondary');
+
+      window.setTimeout(() => {
+        el.classList.add('btn-outline-secondary');
+        el.classList.remove(`btn-${stateClass}`);
+      }, 1500);
+    };
+
+    downloadLogsButton.addEventListener('click', function() {
+      const logHistory = stringifiedLogHistory();
+      const a = document.createElement('a');
+      const href = URL.createObjectURL(new Blob([logHistory], { type: 'text/plain' }));
+
+      a.setAttribute('download', 'vhs-player-logs.txt');
+      a.setAttribute('target', '_blank');
+      a.href = href;
+      a.click();
+      a.remove();
+      URL.revokeObjectURL(href);
+      doneFeedback(downloadLogsButton, 'success');
+    });
+
+    copyLogsButton.addEventListener('click', function() {
+      const logHistory = stringifiedLogHistory();
+
+      window.navigator.clipboard.writeText(logHistory).then(z => {
+        doneFeedback(copyLogsButton, 'success');
+      }).catch(e => {
+        doneFeedback(copyLogsButton, 'danger');
+        console.log('Copy failed', e);
+      });
+
+    });
   };
+
 }(window));

node_modules/@videojs/http-streaming/scripts/netlify.js

@@ -10,9 +10,9 @@ const files = [
   'node_modules/videojs-contrib-eme/dist/videojs-contrib-eme.min.js',
   'node_modules/videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels.js',
   'node_modules/videojs-contrib-quality-levels/dist/videojs-contrib-quality-levels.min.js',
-  'node_modules/jb-videojs-hls-quality-selector/dist/videojs-hls-quality-selector.css',
-  'node_modules/jb-videojs-hls-quality-selector/dist/jb-videojs-hls-quality-selector.js',
-  'node_modules/jb-videojs-hls-quality-selector/dist/jb-videojs-hls-quality-selector.min.js',
+  'node_modules/videojs-contrib-quality-menu/dist/videojs-contrib-quality-menu.css',
+  'node_modules/videojs-contrib-quality-menu/dist/videojs-contrib-quality-menu.js',
+  'node_modules/videojs-contrib-quality-menu/dist/videojs-contrib-quality-menu.min.js',
   'node_modules/bootstrap/dist/js/bootstrap.js',
   'node_modules/bootstrap/dist/css/bootstrap.css',
   'node_modules/d3/d3.min.js',

node_modules/@videojs/http-streaming/src/playlist-controller.js

@@ -1059,15 +1059,10 @@ export class PlaylistController extends videojs.EventTarget {
 
   runFastQualitySwitch_() {
     this.waitingForFastQualityPlaylistReceived_ = false;
-    // Delete all buffered data to allow an immediate quality switch, then seek to give
-    // the browser a kick to remove any cached frames from the previous rendtion (.04 seconds
-    // ahead was roughly the minimum that will accomplish this across a variety of content
-    // in IE and Edge, but seeking in place is sufficient on all other browsers)
-    // Edge/IE bug: https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/14600375/
-    // Chrome bug: https://bugs.chromium.org/p/chromium/issues/detail?id=651904
+    // Delete all buffered data to allow an immediate quality switch.
     this.mainSegmentLoader_.pause();
     this.mainSegmentLoader_.resetEverything(() => {
-      this.tech_.setCurrentTime(this.tech_.currentTime());
+      this.mainSegmentLoader_.load();
     });
 
     // don't need to reset audio as it is reset when media changes

node_modules/@videojs/http-streaming/src/segment-loader.js

@@ -406,6 +406,32 @@ export const shouldWaitForTimelineChange = ({
   return false;
 };
 
+export const shouldFixBadTimelineChanges = (timelineChangeController) => {
+  if (!timelineChangeController) {
+    return false;
+  }
+  const pendingAudioTimelineChange = timelineChangeController.pendingTimelineChange({ type: 'audio' });
+  const pendingMainTimelineChange = timelineChangeController.pendingTimelineChange({ type: 'main' });
+  const hasPendingTimelineChanges = pendingAudioTimelineChange && pendingMainTimelineChange;
+  const differentPendingChanges = hasPendingTimelineChanges && pendingAudioTimelineChange.to !== pendingMainTimelineChange.to;
+  const isNotInitialPendingTimelineChange = hasPendingTimelineChanges && pendingAudioTimelineChange.from !== -1 && pendingMainTimelineChange.from !== -1;
+
+  if (isNotInitialPendingTimelineChange && differentPendingChanges) {
+    return true;
+  }
+
+  return false;
+};
+
+export const fixBadTimelineChange = (segmentLoader) => {
+  if (!segmentLoader) {
+    return;
+  }
+  segmentLoader.pause();
+  segmentLoader.resetEverything();
+  segmentLoader.load();
+};
+
 export const mediaDuration = (timingInfos) => {
   let maxDuration = 0;
 
@@ -2130,6 +2156,9 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
         audioDisabled: this.audioDisabled_
       })
     ) {
+      if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+        fixBadTimelineChange(this);
+      }
       return false;
     }
 
@@ -2180,6 +2209,7 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
       return false;
     }
 
+    // we need to allow an append here even if we're moving to different timelines.
     if (
       shouldWaitForTimelineChange({
         timelineChangeController: this.timelineChangeController_,
@@ -2189,6 +2219,9 @@ Fetch At Buffer: ${this.fetchAtBuffer_}
         audioDisabled: this.audioDisabled_
       })
     ) {
+      if (shouldFixBadTimelineChanges(this.timelineChangeController_)) {
+        fixBadTimelineChange(this);
+      }
       return false;
     }
 

node_modules/@videojs/http-streaming/src/source-updater.js

@@ -818,7 +818,7 @@ export default class SourceUpdater extends videojs.EventTarget {
     if (typeof offset !== 'undefined' &&
         this.videoBuffer &&
         // no point in updating if it's the same
-        this.videoTimestampOffset !== offset) {
+        this.videoTimestampOffset_ !== offset) {
       pushQueue({
         type: 'video',
         sourceUpdater: this,