fix: Conditional requestVideoFrameCallback on Safari

src/js/tech/html5.js

@@ -745,12 +745,15 @@ class Html5 extends Tech {
 
   /**
    * Native requestVideoFrameCallback if supported by browser/tech, or fallback
+   * Don't use rVCF on Safari when DRM is playing, as it doesn't fire
+   * Needs to be checked later than the constructor
+   * This will be a false positive for clear sources loaded after a Fairplay source
    *
    * @param {function} cb function to call
    * @return {number} id of request
    */
   requestVideoFrameCallback(cb) {
-    if (this.featuresVideoFrameCallback) {
+    if (this.featuresVideoFrameCallback && !this.el_.webkitKeys) {
       return this.el_.requestVideoFrameCallback(cb);
     }
     return super.requestVideoFrameCallback(cb);
@@ -762,7 +765,7 @@ class Html5 extends Tech {
    * @param {number} id request id to cancel
    */
   cancelVideoFrameCallback(id) {
-    if (this.featuresVideoFrameCallback) {
+    if (this.featuresVideoFrameCallback && !this.el_.webkitKeys) {
       this.el_.cancelVideoFrameCallback(id);
     } else {
       super.cancelVideoFrameCallback(id);

test/unit/tech/html5.test.js

@@ -1044,3 +1044,20 @@ QUnit.test('featuresVideoFrameCallback is false for audio elements', function(as
 
   audioTech.dispose();
 });
+
+QUnit.test('featuresVideoFrameCallback is false for Safari DRM', function(assert) {
+  // Looking for `super.requestVideoFrameCallback()` being called
+  const spy = sinon.spy(Object.getPrototypeOf(Object.getPrototypeOf(tech)), 'requestVideoFrameCallback');
+
+  tech.featuresVideoFrameCallback = true;
+
+  try {
+    tech.el_.webkitKeys = {};
+    tech.requestVideoFrameCallback(function() {});
+
+    assert.ok(spy.calledOnce, false, 'rvf fallback used');
+  } catch (e) {
+    // video.webkitKeys isn't writable on Safari, so relying on the mocked property on other browsers
+    assert.ok(true, 'skipped because webkitKeys not writable');
+  }
+});