diff --git a/src/js/player.js b/src/js/player.js index ddffa5bdca..4c6c38f3cb 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -2003,7 +2003,8 @@ class Player extends Component { } /** - * Handle a double-click on the media element to enter/exit fullscreen + * Handle a double-click on the media element to enter/exit fullscreen, + * or exit documentPictureInPicture mode * * @param {Event} event * the event that caused this function to trigger @@ -2045,7 +2046,12 @@ class Player extends Component { ) { this.options_.userActions.doubleClick.call(this, event); - + } else if (this.isInPictureInPicture() && !document.pictureInPictureElement) { + // Checking the presence of `window.documentPictureInPicture.window` complicates + // tests, checking `document.pictureInPictureElement` also works. It wouldn't + // be null in regular picture in picture. + // Exit picture in picture mode. This gesture can't trigger pip on the main window. + this.exitPictureInPicture(); } else if (this.isFullscreen()) { this.exitFullscreen(); } else { diff --git a/test/unit/player-user-actions.test.js b/test/unit/player-user-actions.test.js index 4d46e5e1fe..d639434edc 100644 --- a/test/unit/player-user-actions.test.js +++ b/test/unit/player-user-actions.test.js @@ -151,6 +151,19 @@ QUnit.test('by default, double-click opens fullscreen', function(assert) { assert.strictEqual(this.player.exitFullscreen.callCount, 1, 'has exited fullscreen'); }); +QUnit.test('in document picture in picture mode, double-click exits pip', function(assert) { + this.player.isInPictureInPicture = () => true; + this.player.exitPictureInPicture = sinon.spy(); + this.player.requestFullscreen = sinon.spy(); + this.player.exitFullscreen = sinon.spy(); + + this.player.handleTechDoubleClick_({target: this.player.tech_.el_}); + + assert.strictEqual(this.player.exitPictureInPicture.callCount, 1, 'has exited pip once'); + assert.strictEqual(this.player.requestFullscreen.callCount, 0, 'has not entered fullscreen'); + assert.strictEqual(this.player.exitFullscreen.callCount, 0, 'has not exited fullscreen'); +}); + QUnit.test('when controls are disabled, double-click does nothing', function(assert) { let fullscreen = false;