From b8ee8858f8d074f895946a53d2e74ab99a11d64f Mon Sep 17 00:00:00 2001 From: Pat O'Neill Date: Fri, 21 Oct 2022 12:19:01 -0400 Subject: [PATCH] refactor: rename fn.bind to fn.bind_ to strongly indicate it should not be used externally (#7940) --- src/js/component.js | 10 +++++----- .../control-bar/progress-control/mouse-time-display.js | 2 +- .../control-bar/progress-control/play-progress-bar.js | 2 +- .../control-bar/progress-control/progress-control.js | 6 +++--- src/js/control-bar/progress-control/seek-bar.js | 2 +- src/js/control-bar/progress-control/time-tooltip.js | 2 +- .../text-track-controls/descriptions-button.js | 2 +- src/js/control-bar/track-button.js | 2 +- .../volume-control/mouse-volume-level-display.js | 2 +- src/js/control-bar/volume-control/volume-control.js | 4 ++-- .../control-bar/volume-control/volume-level-tooltip.js | 2 +- src/js/mixins/evented.js | 4 ++-- src/js/player.js | 6 ++++-- src/js/tech/tech.js | 2 +- src/js/tracks/text-track-display.js | 2 +- src/js/tracks/text-track.js | 4 ++-- src/js/utils/fn.js | 6 +++--- src/js/video.js | 6 +++--- test/unit/utils/fn.test.js | 2 +- test/unit/videojs-integration.test.js | 6 +++--- 20 files changed, 38 insertions(+), 36 deletions(-) diff --git a/src/js/component.js b/src/js/component.js index d48d179e8..f16b2a47f 100644 --- a/src/js/component.js +++ b/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(); diff --git a/src/js/control-bar/progress-control/mouse-time-display.js b/src/js/control-bar/progress-control/mouse-time-display.js index 1334f3c24..2b9140dc6 100644 --- a/src/js/control-bar/progress-control/mouse-time-display.js +++ b/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); } /** diff --git a/src/js/control-bar/progress-control/play-progress-bar.js b/src/js/control-bar/progress-control/play-progress-bar.js index c63d953d6..08adb584d 100644 --- a/src/js/control-bar/progress-control/play-progress-bar.js +++ b/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); } /** diff --git a/src/js/control-bar/progress-control/progress-control.js b/src/js/control-bar/progress-control/progress-control.js index f79062f7f..013ef5a0a 100644 --- a/src/js/control-bar/progress-control/progress-control.js +++ b/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); diff --git a/src/js/control-bar/progress-control/seek-bar.js b/src/js/control-bar/progress-control/seek-bar.js index 9b782f070..7c5e1fbc5 100644 --- a/src/js/control-bar/progress-control/seek-bar.js +++ b/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); diff --git a/src/js/control-bar/progress-control/time-tooltip.js b/src/js/control-bar/progress-control/time-tooltip.js index bf85cecbb..c1cc86340 100644 --- a/src/js/control-bar/progress-control/time-tooltip.js +++ b/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); } /** diff --git a/src/js/control-bar/text-track-controls/descriptions-button.js b/src/js/control-bar/text-track-controls/descriptions-button.js index f98f70955..8e7fc3bb8 100644 --- a/src/js/control-bar/text-track-controls/descriptions-button.js +++ b/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() { diff --git a/src/js/control-bar/track-button.js b/src/js/control-bar/track-button.js index bdf21a4fe..3452f71ec 100644 --- a/src/js/control-bar/track-button.js +++ b/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); diff --git a/src/js/control-bar/volume-control/mouse-volume-level-display.js b/src/js/control-bar/volume-control/mouse-volume-level-display.js index 9b2b89dec..617693bd0 100644 --- a/src/js/control-bar/volume-control/mouse-volume-level-display.js +++ b/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); } /** diff --git a/src/js/control-bar/volume-control/volume-control.js b/src/js/control-bar/volume-control/volume-control.js index dcaa4a787..61ff1c4b9 100644 --- a/src/js/control-bar/volume-control/volume-control.js +++ b/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)); diff --git a/src/js/control-bar/volume-control/volume-level-tooltip.js b/src/js/control-bar/volume-control/volume-level-tooltip.js index a68e4a470..3fc35c343 100644 --- a/src/js/control-bar/volume-control/volume-level-tooltip.js +++ b/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); } /** diff --git a/src/js/mixins/evented.js b/src/js/mixins/evented.js index 5ca8cf69a..7bfbb8cb9 100644 --- a/src/js/mixins/evented.js +++ b/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(). diff --git a/src/js/player.js b/src/js/player.js index 17d414cbb..e8e5b30c4 100644 --- a/src/js/player.js +++ b/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} diff --git a/src/js/tech/tech.js b/src/js/tech/tech.js index 967272bfc..66e7ed123 100644 --- a/src/js/tech/tech.js +++ b/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(); diff --git a/src/js/tracks/text-track-display.js b/src/js/tracks/text-track-display.js index 408ddc766..00c85fd43 100644 --- a/src/js/tracks/text-track-display.js +++ b/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; diff --git a/src/js/tracks/text-track.js b/src/js/tracks/text-track.js index b6b6cc064..caf766c32 100644 --- a/src/js/tracks/text-track.js +++ b/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; } diff --git a/src/js/utils/fn.js b/src/js/utils/fn.js index 4365c7616..ef957f949 100644 --- a/src/js/utils/fn.js +++ b/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(); diff --git a/src/js/video.js b/src/js/video.js index fa585bdea..bf2f893b4 100644 --- a/src/js/video.js +++ b/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; diff --git a/test/unit/utils/fn.test.js b/test/unit/utils/fn.test.js index b6462bda2..9ff23c702 100644 --- a/test/unit/utils/fn.test.js +++ b/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(); }); diff --git a/test/unit/videojs-integration.test.js b/test/unit/videojs-integration.test.js index ea0fd6459..15c10884b 100644 --- a/test/unit/videojs-integration.test.js +++ b/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;