refactor: rename fn.bind to fn.bind_ to strongly indicate it should not be used externally (#7940)

src/js/component.js

@@ -1321,7 +1321,7 @@ class Component {
     }
 
     // listener for reporting that the user is active
-    const report = Fn.bind(this.player(), this.player().reportUserActivity);
+    const report = Fn.bind_(this.player(), this.player().reportUserActivity);
 
     let touchHolding;
 
@@ -1384,7 +1384,7 @@ class Component {
     // eslint-disable-next-line
     var timeoutId, disposeFn;
 
-    fn = Fn.bind(this, fn);
+    fn = Fn.bind_(this, fn);
 
     this.clearTimersOnDispose_();
 
@@ -1445,7 +1445,7 @@ class Component {
    * @see [Similar to]{@link https://developer.mozilla.org/en-US/docs/Web/API/WindowTimers/setInterval}
    */
   setInterval(fn, interval) {
-    fn = Fn.bind(this, fn);
+    fn = Fn.bind_(this, fn);
 
     this.clearTimersOnDispose_();
 
@@ -1511,7 +1511,7 @@ class Component {
     // declare as variables so they are properly available in rAF function
     // eslint-disable-next-line
     var id;
-    fn = Fn.bind(this, fn);
+    fn = Fn.bind_(this, fn);
 
     id = window.requestAnimationFrame(() => {
       if (this.rafIds_.has(id)) {
@@ -1542,7 +1542,7 @@ class Component {
     }
     this.clearTimersOnDispose_();
 
-    fn = Fn.bind(this, fn);
+    fn = Fn.bind_(this, fn);
 
     const id = this.requestAnimationFrame(() => {
       fn();

src/js/control-bar/progress-control/mouse-time-display.js

@@ -27,7 +27,7 @@ class MouseTimeDisplay extends Component {
    */
   constructor(player, options) {
     super(player, options);
-    this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
+    this.update = Fn.throttle(Fn.bind_(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
   }
 
   /**

src/js/control-bar/progress-control/play-progress-bar.js

@@ -26,7 +26,7 @@ class PlayProgressBar extends Component {
    */
   constructor(player, options) {
     super(player, options);
-    this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
+    this.update = Fn.throttle(Fn.bind_(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
   }
 
   /**

src/js/control-bar/progress-control/progress-control.js

@@ -4,7 +4,7 @@
 import Component from '../../component.js';
 import * as Dom from '../../utils/dom.js';
 import {clamp} from '../../utils/num.js';
-import {bind, throttle, UPDATE_REFRESH_INTERVAL} from '../../utils/fn.js';
+import {bind_, throttle, UPDATE_REFRESH_INTERVAL} from '../../utils/fn.js';
 import {silencePromise} from '../../utils/promise';
 
 import './seek-bar.js';
@@ -28,8 +28,8 @@ class ProgressControl extends Component {
    */
   constructor(player, options) {
     super(player, options);
-    this.handleMouseMove = throttle(bind(this, this.handleMouseMove), UPDATE_REFRESH_INTERVAL);
-    this.throttledHandleMouseSeek = throttle(bind(this, this.handleMouseSeek), UPDATE_REFRESH_INTERVAL);
+    this.handleMouseMove = throttle(bind_(this, this.handleMouseMove), UPDATE_REFRESH_INTERVAL);
+    this.throttledHandleMouseSeek = throttle(bind_(this, this.handleMouseSeek), UPDATE_REFRESH_INTERVAL);
     this.handleMouseUpHandler_ = (e) => this.handleMouseUp(e);
     this.handleMouseDownHandler_ = (e) => this.handleMouseDown(e);
 

src/js/control-bar/progress-control/seek-bar.js

@@ -49,7 +49,7 @@ class SeekBar extends Slider {
    * @private
    */
   setEventHandlers_() {
-    this.update_ = Fn.bind(this, this.update);
+    this.update_ = Fn.bind_(this, this.update);
     this.update = Fn.throttle(this.update_, Fn.UPDATE_REFRESH_INTERVAL);
 
     this.on(this.player_, ['ended', 'durationchange', 'timeupdate'], this.update);

src/js/control-bar/progress-control/time-tooltip.js

@@ -24,7 +24,7 @@ class TimeTooltip extends Component {
    */
   constructor(player, options) {
     super(player, options);
-    this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
+    this.update = Fn.throttle(Fn.bind_(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
   }
 
   /**

src/js/control-bar/text-track-controls/descriptions-button.js

@@ -28,7 +28,7 @@ class DescriptionsButton extends TextTrackButton {
     super(player, options, ready);
 
     const tracks = player.textTracks();
-    const changeHandler = Fn.bind(this, this.handleTracksChange);
+    const changeHandler = Fn.bind_(this, this.handleTracksChange);
 
     tracks.addEventListener('change', changeHandler);
     this.on('dispose', function() {

src/js/control-bar/track-button.js

@@ -34,7 +34,7 @@ class TrackButton extends MenuButton {
       return;
     }
 
-    const updateHandler = Fn.bind(this, this.update);
+    const updateHandler = Fn.bind_(this, this.update);
 
     tracks.addEventListener('removetrack', updateHandler);
     tracks.addEventListener('addtrack', updateHandler);

src/js/control-bar/volume-control/mouse-volume-level-display.js

@@ -27,7 +27,7 @@ class MouseVolumeLevelDisplay extends Component {
    */
   constructor(player, options) {
     super(player, options);
-    this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
+    this.update = Fn.throttle(Fn.bind_(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
   }
 
   /**

src/js/control-bar/volume-control/volume-control.js

@@ -4,7 +4,7 @@
 import Component from '../../component.js';
 import checkVolumeSupport from './check-volume-support';
 import {isPlain} from '../../utils/obj';
-import {throttle, bind, UPDATE_REFRESH_INTERVAL} from '../../utils/fn.js';
+import {throttle, bind_, UPDATE_REFRESH_INTERVAL} from '../../utils/fn.js';
 
 // Required children
 import './volume-bar.js';
@@ -40,7 +40,7 @@ class VolumeControl extends Component {
     // hide this control if volume support is missing
     checkVolumeSupport(this, player);
 
-    this.throttledHandleMouseMove = throttle(bind(this, this.handleMouseMove), UPDATE_REFRESH_INTERVAL);
+    this.throttledHandleMouseMove = throttle(bind_(this, this.handleMouseMove), UPDATE_REFRESH_INTERVAL);
     this.handleMouseUpHandler_ = (e) => this.handleMouseUp(e);
 
     this.on('mousedown', (e) => this.handleMouseDown(e));

src/js/control-bar/volume-control/volume-level-tooltip.js

@@ -23,7 +23,7 @@ class VolumeLevelTooltip extends Component {
    */
   constructor(player, options) {
     super(player, options);
-    this.update = Fn.throttle(Fn.bind(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
+    this.update = Fn.throttle(Fn.bind_(this, this.update), Fn.UPDATE_REFRESH_INTERVAL);
   }
 
   /**

src/js/mixins/evented.js

@@ -189,7 +189,7 @@ const normalizeListenArgs = (self, args, fnName) => {
   validateEventType(type, self, fnName);
   validateListener(listener, self, fnName);
 
-  listener = Fn.bind(self, listener);
+  listener = Fn.bind_(self, listener);
 
   return {isTargetingSelf, target, type, listener};
 };
@@ -410,7 +410,7 @@ const EventedMixin = {
       validateListener(listener, this, 'off');
 
       // Ensure there's at least a guid, even if the function hasn't been used
-      listener = Fn.bind(this, listener);
+      listener = Fn.bind_(this, listener);
 
       // Remove the dispose listener on this evented object, which was given
       // the same guid as the event listener in on().

src/js/player.js

@@ -1194,7 +1194,7 @@ class Player extends Component {
     this.tech_ = new TechClass(techOptions);
 
     // player.triggerReady is always async, so don't need this to be async
-    this.tech_.ready(Fn.bind(this, this.handleTechReady_), true);
+    this.tech_.ready(Fn.bind_(this, this.handleTechReady_), true);
 
     textTrackConverter.jsonToTextTracks(this.textTracksJson_ || [], this.tech_);
 
@@ -4052,7 +4052,7 @@ class Player extends Component {
     let mouseInProgress;
     let lastMoveX;
     let lastMoveY;
-    const handleActivity = Fn.bind(this, this.reportUserActivity);
+    const handleActivity = Fn.bind_(this, this.reportUserActivity);
 
     const handleMouseMove = function(e) {
       // #1068 - Prevent mousemove spamming
@@ -5014,6 +5014,7 @@ class Player extends Component {
 
 /**
  * Get the {@link VideoTrackList}
+ *
  * @link https://html.spec.whatwg.org/multipage/embedded-content.html#videotracklist
  *
  * @return {VideoTrackList}
@@ -5024,6 +5025,7 @@ class Player extends Component {
 
 /**
  * Get the {@link AudioTrackList}
+ *
  * @link https://html.spec.whatwg.org/multipage/embedded-content.html#audiotracklist
  *
  * @return {AudioTrackList}

src/js/tech/tech.js

@@ -236,7 +236,7 @@ class Tech extends Component {
    */
   trackProgress(event) {
     this.stopTrackingProgress();
-    this.progressInterval = this.setInterval(Fn.bind(this, function() {
+    this.progressInterval = this.setInterval(Fn.bind_(this, function() {
       // Don't trigger unless buffered amount is greater than last time
 
       const numBufferedPercent = this.bufferedPercent();

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

@@ -109,7 +109,7 @@ class TextTrackDisplay extends Component {
     // if a track should show by default and the display hadn't loaded yet.
     // Should probably be moved to an external track loader when we support
     // tracks that don't need a display.
-    player.ready(Fn.bind(this, function() {
+    player.ready(Fn.bind_(this, function() {
       if (player.tech_ && player.tech_.featuresNativeTextTracks) {
         this.hide();
         return;

src/js/tracks/text-track.js

@@ -86,7 +86,7 @@ const loadTrack = function(src, track) {
     opts.withCredentials = withCredentials;
   }
 
-  XHR(opts, Fn.bind(this, function(err, response, responseBody) {
+  XHR(opts, Fn.bind_(this, function(err, response, responseBody) {
     if (err) {
       return log.error(err, response);
     }
@@ -184,7 +184,7 @@ class TextTrack extends Track {
     const activeCues = new TextTrackCueList(this.activeCues_);
     let changed = false;
 
-    this.timeupdateHandler = Fn.bind(this, function(event = {}) {
+    this.timeupdateHandler = Fn.bind_(this, function(event = {}) {
       if (this.tech_.isDisposed()) {
         return;
       }

src/js/utils/fn.js

@@ -8,12 +8,12 @@ import window from 'global/window';
 export const UPDATE_REFRESH_INTERVAL = 30;
 
 /**
- * Bind (a.k.a proxy or context). A simple method for changing the context of
- * a function.
+ * A private, internal-only function for changing the context of a function.
  *
  * It also stores a unique id on the function so it can be easily removed from
  * events.
  *
+ * @private
  * @function
  * @param    {Mixed} context
  *           The object to bind as scope.
@@ -27,7 +27,7 @@ export const UPDATE_REFRESH_INTERVAL = 30;
  * @return   {Function}
  *           The new function that will be bound into the context given
  */
-export const bind = function(context, fn, uid) {
+export const bind_ = function(context, fn, uid) {
   // Make sure the function has a unique ID
   if (!fn.guid) {
     fn.guid = newGUID();

src/js/video.js

@@ -377,13 +377,13 @@ videojs.mergeOptions = deprecateForMajor(9, 'videojs.mergeOptions', 'videojs.obj
 videojs.defineLazyProperty = deprecateForMajor(9, 'videojs.defineLazyProperty', 'videojs.obj.defineLazyProperty', Obj.defineLazyProperty);
 
 /**
- * Deprecated reference to the {@link module:fn.bind|fn.bind function}
+ * Deprecated reference to the {@link module:fn.bind_|fn.bind_ function}
  *
  * @type {Function}
- * @see {@link module:fn.bind|fn.bind}
+ * @see {@link module:fn.bind_|fn.bind_}
  * @deprecated Deprecated and will be removed in 9.0. Please use native Function.prototype.bind instead.
  */
-videojs.bind = deprecateForMajor(9, 'videojs.bind', 'native Function.prototype.bind', Fn.bind);
+videojs.bind = deprecateForMajor(9, 'videojs.bind', 'native Function.prototype.bind', Fn.bind_);
 
 videojs.registerPlugin = Plugin.registerPlugin;
 videojs.deregisterPlugin = Plugin.deregisterPlugin;

test/unit/utils/fn.test.js

@@ -18,7 +18,7 @@ QUnit.test('should add context to a function', function(assert) {
   const asdf = function() {
     assert.ok(this === newContext);
   };
-  const fdsa = Fn.bind(newContext, asdf);
+  const fdsa = Fn.bind_(newContext, asdf);
 
   fdsa();
 });

test/unit/videojs-integration.test.js

@@ -18,10 +18,10 @@ QUnit.test('create a real player and dispose', function(assert) {
 
   // TODO: remove this code when we have a videojs debug build
   // see https://github.com/videojs/video.js/issues/5858
-  old.bind = Fn.bind;
+  old.bind_ = Fn.bind_;
 
-  Fn.stub_bind(function(context, fn, uid) {
-    const retval = old.bind(context, fn, uid);
+  Fn.stub_bind_(function(context, fn, uid) {
+    const retval = old.bind_(context, fn, uid);
 
     retval.og_ = fn.og_ || fn;
     retval.cx_ = fn.cx_ || context;