1534986 - If a Picture-in-Picture'd video requests fullscreen, Picture-in-Picture should exit first

Status: RESOLVED FIXED

(Toolkit :: Video/Audio Controls, defect, P3)

Description

[Mike Conley (:mconley) (:⚙️) (PTO: May 24 - June 2nd)]

STR:

0. Ensure media.videocontrols.picture-in-picture.enabled is set to true
1. Visit https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video
2. Right-click on the video, and choose Picture in Picture
3. In the original player tab, click on the fullscreen button on the video player

ER:

Picture-in-Picture should close, and the flower video should be played in fullscreen.

AR:

The "This video is playing in Picture-in-Picture mode" message is fullscreened instead.

Comment 1

[Mike Conley (:mconley) (:⚙️) (PTO: May 24 - June 2nd)]

This should get fixed soon in a later milestone, but until we get there, I'm making this a P3.

Comment 2

[Mike Conley (:mconley) (:⚙️) (PTO: May 24 - June 2nd)]

Hey astevenson,

I originally filed this thinking that it wouldn't make much sense to fullscreen the "This video is in Picture-in-Picture mode", but I'm scrubbing this bug list and wanted to run it by you. Is this something you think we should fix someday, or should we close this as WONTFIX?

Comment 3

[Adam Stevenson [:adamopenweb]]

This seems like something that should be fixed someday. As this workflow could be fairly common with streaming.

Example: Streaming twitch in PiP then your favourite gamer gets to the final round, you want to pop into full screen for a few minutes.

I think leaving as P3 makes sense for now.

Comment 4

[Timea Cernea [:tbabos]]

Attachment: YouTube behavior

The behavior described in Comment 0 can be seen on Vimeo as well.

On Youtube: the video will return to full screen and played back but the PiP window is still displayed and frozen with a frame. The buttons from PiP "Play/Pause" will actually control the fullscreen window.

Comment 5

[Cristian Craciun]

Build ID 20191124230652
User Agent Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:72.0) Gecko/20100101 Firefox/72.0

Reproducible also on Nightly 72 on macOS 10.13 platform.

The actual result is different on macOS:
On the link from Comment 0 the video is not launched on full screen if the PiP window is active. Should I log another issue for this behavior?
On Vimeo the behavior is the same as described in Comment 0.
On Youtube I didn't managed to reproduce this issue on macOS.

Comment 6

[Adam Stevenson [:adamopenweb]]

I can reproduce on MacOS while using Youtube.

The video on MDN from Comment 0 is running into an error when trying to use full screen in general

Request for fullscreen was denied because of FeaturePolicy directives.

Comment 7

[Adam Stevenson [:adamopenweb]]

It seems that Chrome, Opera and Vivaldi also have this issue. But Firefox is the only one that has double click to full screen on the PiP window.

Comment 8

[Mike Conley (:mconley) (:⚙️) (PTO: May 24 - June 2nd)]

When a Picture-in-Picture player window is open, we have code that's watching the underlying <video> element that's being PiP'd for changes. Going into fullscreen is one of those changes that we want to monitor for. When we see that change, we should tell Firefox to close the PiP player window.

Here's where we add event listeners for the <video>: https://searchfox.org/mozilla-central/rev/eb9d5c97927aea75f0c8e38bbc5b5d288099e687/toolkit/actors/PictureInPictureChild.jsm#1237-1240

The event we want to listen for is MozDOMFullscreen:Request. This is a special event - unlike the other media events on the video like play and pause, MozDOMFullscreen:Request is special because it's a "chrome-only event"[1]. This means we have to listen to it specially - you'll need to get to the <video> element's "chrome event handler" on the window that it belongs to, and call addEventListener on that. Something like this:

   let chromeEventHandler = originatingWindow.docShell.chromeEventHandler;
    ...
   chromeEventHandler.addEventListener("MozDOMFullscreen:Request", this, true);

don't forget to remove the listener in the untrackOriginatingVideo method too!

Then, you'll want to add a handler for that event in the switch statement here: https://searchfox.org/mozilla-central/rev/eb9d5c97927aea75f0c8e38bbc5b5d288099e687/toolkit/actors/PictureInPictureChild.jsm#1004-1061

and roughly do the same thing that "pagehide" does, which is to call closePictureInPicture. You'll want to pass a different reason though - probably "fullscreen" instead.

That reason property is used as part of our Telemetry that measures the different ways that the player is closed.

A site that you can test this behaviour on is Vimeo - perhaps this video: https://vimeo.com/415176232?ref=tw-share

I recommend this over YouTube, because it seems as if lately YouTube is doing something that causes the PiP player window to close when going into fullscreen (probably because they're swapping out the <video> element or something).

[1]: The term "chrome" means "elevated privileges because it's part of the browser UI". This term existed before the Chrome browser. Presumably, they named their browser after this term, which has added to much confusion.

Comment 9

[Hunter Jones]

Attachment: Bug 1534986: Fixed Picture-In-Picture to close when fullscreening r?mconley,gijs

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/f230446ab411
Fixed Picture-In-Picture to close when fullscreening r=mconley

Comment 11

[Bogdan Tara[:bogdan_tara | bogdant]]

https://hg.mozilla.org/mozilla-central/rev/f230446ab411