feat(middleware): allow middleware to handle volume setter and getter (#5906)

Allow middleware to handle volume setter and getter. This supports things like ducking the playback volume programmatically, without affecting the player's UI volume control.

Author: OwenEdwards

src/js/tech/middleware.js

@@ -186,7 +186,8 @@ export const allowedGetters = {
   duration: 1,
   seekable: 1,
   played: 1,
-  paused: 1
+  paused: 1,
+  volume: 1
 };
 
 /**
@@ -195,7 +196,8 @@ export const allowedGetters = {
  * @type {Object}
  */
 export const allowedSetters = {
-  setCurrentTime: 1
+  setCurrentTime: 1,
+  setVolume: 1
 };
 
 /**

test/unit/play.test.js

@@ -414,7 +414,7 @@ const mainModule = function(playReturnValue, middlewareTermination, subhooks) {
 
   // without enableSourceset this test will fail.
   QUnit.test('Player#play() resolves correctly on tech el src', function(assert) {
-    this.player = TestHelpers.makePlayer({techOrder: ['html5'], enableSourceset: true}, null, false);
+    this.player = TestHelpers.makePlayer({techOrder: ['html5'], enableSourceset: true});
 
     this.playTest('player/tech start out ready', {
       techReady: true,

test/unit/player.test.js

@@ -1687,13 +1687,17 @@ QUnit.test('should not allow to register custom player when any player has been
 
 QUnit.test('techGet runs through middleware if allowedGetter', function(assert) {
   let cts = 0;
+  let vols = 0;
   let durs = 0;
   let lps = 0;
 
   videojs.use('video/foo', () => ({
     currentTime() {
       cts++;
     },
+    volume() {
+      vols++;
+    },
     duration() {
       durs++;
     },
@@ -1714,10 +1718,12 @@ QUnit.test('techGet runs through middleware if allowedGetter', function(assert)
   player.middleware_ = [middleware.getMiddleware('video/foo')[0](player)];
 
   player.techGet_('currentTime');
+  player.techGet_('volume');
   player.techGet_('duration');
   player.techGet_('loop');
 
   assert.equal(cts, 1, 'currentTime is allowed');
+  assert.equal(vols, 1, 'volume is allowed');
   assert.equal(durs, 1, 'duration is allowed');
   assert.equal(lps, 0, 'loop is not allowed');
 
@@ -1728,6 +1734,7 @@ QUnit.test('techGet runs through middleware if allowedGetter', function(assert)
 QUnit.test('techCall runs through middleware if allowedSetter', function(assert) {
   let cts = 0;
   let vols = 0;
+  let prs = 0;
 
   videojs.use('video/foo', () => ({
     setCurrentTime(ct) {
@@ -1736,6 +1743,11 @@ QUnit.test('techCall runs through middleware if allowedSetter', function(assert)
     },
     setVolume() {
       vols++;
+      return vols;
+    },
+    setPlaybackRate() {
+      prs++;
+      return prs;
     }
   }));
 
@@ -1754,11 +1766,13 @@ QUnit.test('techCall runs through middleware if allowedSetter', function(assert)
 
   player.techCall_('setCurrentTime', 10);
   player.techCall_('setVolume', 0.5);
+  player.techCall_('setPlaybackRate', 0.75);
 
   this.clock.tick(1);
 
   assert.equal(cts, 1, 'setCurrentTime is allowed');
-  assert.equal(vols, 0, 'setVolume is not allowed');
+  assert.equal(vols, 1, 'setVolume is allowed');
+  assert.equal(prs, 0, 'setPlaybackRate is not allowed');
 
   middleware.getMiddleware('video/foo').pop();
   player.dispose();

test/unit/test-helpers.js

@@ -11,7 +11,7 @@ const TestHelpers = {
     return videoTag;
   },
 
-  makePlayer(playerOptions, videoTag, addTechAsMiddleware = true) {
+  makePlayer(playerOptions, videoTag) {
     videoTag = videoTag || TestHelpers.makeTag();
 
     const fixture = document.getElementById('qunit-fixture');
@@ -21,13 +21,7 @@ const TestHelpers = {
     playerOptions = playerOptions || {};
     playerOptions.techOrder = playerOptions.techOrder || ['techFaker'];
 
-    const player = new Player(videoTag, playerOptions);
-
-    if (addTechAsMiddleware) {
-      player.middleware_ = [player.tech_];
-    }
-
-    return player;
+    return new Player(videoTag, playerOptions);
   },
 
   getComputedStyle(el, rule) {