https://github.com/WWBN/AVideo/issues/9674

node_modules/video.js/core.es.js

@@ -1,6 +1,6 @@
 /**
  * @license
- * Video.js 8.19.1 <http://videojs.com/>
+ * Video.js 8.21.0 <http://videojs.com/>
  * Copyright Brightcove, Inc. <https://www.brightcove.com/>
  * Available under Apache License Version 2.0
  * <https://github.com/videojs/video.js/blob/main/LICENSE>
@@ -15,7 +15,7 @@ import document$1 from 'global/document';
 import XHR from '@videojs/xhr';
 import vtt from 'videojs-vtt.js';
 
-var version = "8.19.1";
+var version = "8.21.0";
 
 /**
  * An Object that contains lifecycle hooks as keys which point to an array
@@ -13497,7 +13497,19 @@ class SeekBar extends Slider {
    *        The key/value store of player options.
    */
   constructor(player, options) {
+    options = merge(SeekBar.prototype.options_, options);
+
+    // Avoid mutating the prototype's `children` array by creating a copy
+    options.children = [...options.children];
+    const shouldDisableSeekWhileScrubbingOnMobile = player.options_.disableSeekWhileScrubbingOnMobile && (IS_IOS || IS_ANDROID);
+
+    // Add the TimeTooltip as a child if we are on desktop, or on mobile with `disableSeekWhileScrubbingOnMobile: true`
+    if (!IS_IOS && !IS_ANDROID || shouldDisableSeekWhileScrubbingOnMobile) {
+      options.children.splice(1, 0, 'mouseTimeDisplay');
+    }
     super(player, options);
+    this.shouldDisableSeekWhileScrubbingOnMobile_ = shouldDisableSeekWhileScrubbingOnMobile;
+    this.pendingSeekTime_ = null;
     this.setEventHandlers_();
   }
 
@@ -13653,6 +13665,11 @@ class SeekBar extends Slider {
    *         The percentage of media played so far (0 to 1).
    */
   getPercent() {
+    // If we have a pending seek time, we are scrubbing on mobile and should set the slider percent
+    // to reflect the current scrub location.
+    if (this.pendingSeekTime_) {
+      return this.pendingSeekTime_ / this.player_.duration();
+    }
     const currentTime = this.getCurrentTime_();
     let percent;
     const liveTracker = this.player_.liveTracker;
@@ -13685,7 +13702,12 @@ class SeekBar extends Slider {
     // Stop event propagation to prevent double fire in progress-control.js
     event.stopPropagation();
     this.videoWasPlaying = !this.player_.paused();
-    this.player_.pause();
+
+    // Don't pause if we are on mobile and `disableSeekWhileScrubbingOnMobile: true`.
+    // In that case, playback should continue while the player scrubs to a new location.
+    if (!this.shouldDisableSeekWhileScrubbingOnMobile_) {
+      this.player_.pause();
+    }
     super.handleMouseDown(event);
   }
 
@@ -13743,8 +13765,12 @@ class SeekBar extends Slider {
       }
     }
 
-    // Set new time (tell player to seek to new time)
-    this.userSeek_(newTime);
+    // if on mobile and `disableSeekWhileScrubbingOnMobile: true`, keep track of the desired seek point but we won't initiate the seek until 'touchend'
+    if (this.shouldDisableSeekWhileScrubbingOnMobile_) {
+      this.pendingSeekTime_ = newTime;
+    } else {
+      this.userSeek_(newTime);
+    }
     if (this.player_.options_.enableSmoothSeeking) {
       this.update();
     }
@@ -13783,6 +13809,12 @@ class SeekBar extends Slider {
     }
     this.player_.scrubbing(false);
 
+    // If we have a pending seek time, then we have finished scrubbing on mobile and should initiate a seek.
+    if (this.pendingSeekTime_) {
+      this.userSeek_(this.pendingSeekTime_);
+      this.pendingSeekTime_ = null;
+    }
+
     /**
      * Trigger timeupdate because we're done seeking and the time has changed.
      * This is particularly useful for if the player is paused to time the time displays.
@@ -13919,11 +13951,6 @@ SeekBar.prototype.options_ = {
   children: ['loadProgressBar', 'playProgressBar'],
   barName: 'playProgressBar'
 };
-
-// MouseTimeDisplay tooltips should not be added to a player on mobile devices
-if (!IS_IOS && !IS_ANDROID) {
-  SeekBar.prototype.options_.children.splice(1, 0, 'mouseTimeDisplay');
-}
 Component.registerComponent('SeekBar', SeekBar);
 
 /**
@@ -14048,7 +14075,7 @@ class ProgressControl extends Component {
       return;
     }
     this.off(['mousedown', 'touchstart'], this.handleMouseDownHandler_);
-    this.off(this.el_, 'mousemove', this.handleMouseMove);
+    this.off(this.el_, ['mousemove', 'touchmove'], this.handleMouseMove);
     this.removeListenersAddedOnMousedownAndTouchstart();
     this.addClass('disabled');
     this.enabled_ = false;
@@ -14072,7 +14099,7 @@ class ProgressControl extends Component {
       return;
     }
     this.on(['mousedown', 'touchstart'], this.handleMouseDownHandler_);
-    this.on(this.el_, 'mousemove', this.handleMouseMove);
+    this.on(this.el_, ['mousemove', 'touchmove'], this.handleMouseMove);
     this.removeClass('disabled');
     this.enabled_ = true;
   }
@@ -15952,7 +15979,7 @@ class MenuButton extends Component {
    */
   handleKeyDown(event) {
     // Escape or Tab unpress the 'button'
-    if (event.key === 'Esc' || event.key === 'Tab') {
+    if (event.key === 'Escape' || event.key === 'Tab') {
       if (this.buttonPressed_) {
         this.unpressButton();
       }
@@ -15983,7 +16010,7 @@ class MenuButton extends Component {
    */
   handleMenuKeyUp(event) {
     // Escape hides popup menu
-    if (event.key === 'Esc' || event.key === 'Tab') {
+    if (event.key === 'Escape' || event.key === 'Tab') {
       this.removeClass('vjs-hover');
     }
   }
@@ -16011,7 +16038,7 @@ class MenuButton extends Component {
    */
   handleSubmenuKeyDown(event) {
     // Escape or Tab unpress the 'button'
-    if (event.key === 'Esc' || event.key === 'Tab') {
+    if (event.key === 'Escape' || event.key === 'Tab') {
       if (this.buttonPressed_) {
         this.unpressButton();
       }
@@ -17899,7 +17926,7 @@ class TextTrackSelect extends Component {
       const option = createEl('option', {
         id: optionId,
         value: this.localize(optionText[0]),
-        textContent: optionText[1]
+        textContent: this.localize(optionText[1])
       });
       option.setAttribute('aria-labelledby', `${this.selectLabelledbyIds} ${optionId}`);
       return option;
@@ -17989,7 +18016,7 @@ class TextTrackFieldset extends Component {
         const label = createEl('label', {
           id,
           className: 'vjs-label',
-          textContent: selectConfig.label
+          textContent: this.localize(selectConfig.label)
         });
         label.setAttribute('for', guid);
         span.appendChild(label);
@@ -26679,7 +26706,8 @@ Player.prototype.options_ = {
     horizontalSeek: false
   },
   // Default smooth seeking to false
-  enableSmoothSeeking: false
+  enableSmoothSeeking: false,
+  disableSeekWhileScrubbingOnMobile: false
 };
 TECH_EVENTS_RETRIGGER.forEach(function (event) {
   Player.prototype[`handleTech${toTitleCase(event)}_`] = function () {