Intent to Ship: Picture-in-Picture (PiP)

851 views
Skip to first unread message

François Beaufort

unread,
Jun 14, 2018, 2:45:50 PM6/14/18
to blink-dev

Contact emails

fbea...@chromium.org, apac...@chromium.org, mlam...@chromium.org


Explainer

https://github.com/WICG/picture-in-picture/blob/master/explainer.md


Spec

Specification: https://wicg.github.io/picture-in-picture/

Tag Review: https://github.com/w3ctag/design-reviews/issues/226


Summary

Allow websites to create a floating video window always on top of other windows so that users may continue consuming media while they interact with other content sites, or applications on their device.


Link to “Intent to Implement” blink-dev discussion

https://groups.google.com/a/chromium.org/d/msg/blink-dev/U8Apo-WLBm4/03sO4ITYAQAJ


Link to Origin Trial feedback summary

https://groups.google.com/a/chromium.org/d/msg/blink-dev/xQiDYZEnwaA/MNGbYJnaBwAJ

The Origin Trial was dropped. We mostly wanted to help web developers setup their websites and get feedback for a next version of the API. We now have gathered strong interest from external partners.

Is this feature supported on all six Blink platforms (Windows, Mac, Linux, Chrome OS, Android, and Android WebView)?

The feature will be supported on all platforms (except Android WebView).

It may launch first without Android as frontend is quite different.


Demo link

https://googlechrome.github.io/samples/picture-in-picture/


Risks

Interoperability and Compatibility

Safari has shipped a vendor-prefixed API for Picture-in-Picture and we’ve been working with them on this specification to make sure this API is compliant with their implementation.


Edge: No signals (although have been involved in discussions about spec)

Firefox: Public support (but don't have bandwidth to implement or send spec comments)

Safari: Public support

Web developers: Positive (multiple partners lined up)


Ergonomics

The API is currently limited to video elements. It will be extended in a future version to allow custom controls on the PIP window.


Activation

It will be very easy for web developers to add a custom PiP button to their video players. And they will even be able to use a polyfill to handle the Safari vendor-prefixed API for backward compatibility. It will also be covered by developer documentation at https://developers.google.com/web/updates/.


Is this feature fully tested by web-platform-tests? Link to test suite results from wpt.fyi.

https://github.com/web-platform-tests/wpt/tree/master/picture-in-picture
https://wpt.fyi/results/picture-in-picture

https://github.com/web-platform-tests/wpt/tree/master/feature-policy
https://wpt.fyi/results/feature-policy


Link to entry on the feature dashboard

https://www.chromestatus.com/features/5729206566649856

Andy Paicu

unread,
Jun 18, 2018, 4:19:04 AM6/18/18
to François Beaufort, blink-dev
If the OS or implementation does not restrict the number of PIP windows is there a concern for sites using this to spam PIP windows?

I see that there is a 1 PIP window per document restriction but is there anything that prevents sites from using subframes to bypass the restriction?

Do we limit the number of windows to 1 in our implementation or are there other measures in place to address this?

--
You received this message because you are subscribed to the Google Groups "blink-dev" group.
To unsubscribe from this group and stop receiving emails from it, send an email to blink-dev+...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAEZxfGM%3DCFYtv7PROedeY43UP1okZ%2B8sE68H02mx5ZjatjBTLg%40mail.gmail.com.
--
Regards,
Andy Paicu

François Beaufort

unread,
Jun 19, 2018, 2:35:43 AM6/19/18
to andy...@google.com, blink-dev

紫云飞

unread,
Jun 19, 2018, 3:19:31 PM6/19/18
to blink-dev, andy...@google.com
Chrome implementation of Picture-in-Picture can only have one and unique window.

 per browser window? If you open multiple browser windows then you can open multiple PiP windows?

François Beaufort

unread,
Jun 19, 2018, 4:09:27 PM6/19/18
to blink-dev, andy...@google.com
Per browser window is tip of tree but not the behavior we are going for.
We'll have a one and unique window for all browser windows.

紫云飞

unread,
Jun 19, 2018, 11:25:36 PM6/19/18
to blink-dev, andy...@google.com
The PiP window is currently fixed in the bottom right corner, I wonder if there is a possibility that users can move it to other corners or even move it freely to any position?

François Beaufort

unread,
Jun 20, 2018, 12:14:27 AM6/20/18
to l4462...@gmail.com, blink-dev, andy...@google.com
Users can drag and move the Picture-in-Picture window freely to any position.

On Wed, Jun 20, 2018 at 5:25 AM 紫云飞 <l4462...@gmail.com> wrote:
The PiP window is currently fixed in the bottom right corner, I wonder if there is a possibility that users can move it to other corners or even move it freely to any position?

--
You received this message because you are subscribed to a topic in the Google Groups "blink-dev" group.
To unsubscribe from this topic, visit https://groups.google.com/a/chromium.org/d/topic/blink-dev/ibVPbqBQapU/unsubscribe.
To unsubscribe from this group and all its topics, send an email to blink-dev+...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/6ffb919c-fea6-47d4-91ac-71ee1cea4109%40chromium.org.

Mike West

unread,
Jun 20, 2018, 5:14:03 AM6/20/18
to beaufort...@gmail.com, l4462...@gmail.com, blink-dev, Andy Paicu
LGTM1. It looks like y'all have done good work getting Apple, Mozilla, and TAG folks on board, and ensuring that the mechanism is compatible with the prefixed API WebKit shipped. Looking forward to watching some videos while I work in the near future... :)

-mike


You received this message because you are subscribed to the Google Groups "blink-dev" group.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAEZxfGN2a_uX9U8rzLBuWrT1VrGMeF5TEDwtnwfF0CkdJ0sREA%40mail.gmail.com.

Jochen Eisinger

unread,
Jun 20, 2018, 5:58:49 AM6/20/18
to Mike West, beaufort...@gmail.com, l4462...@gmail.com, blink-dev, Andy Paicu
lgtm2

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAKXHy%3Deoxk3mdXORLQ8QjJga1vfqhsMaaH8OwAWyeKahXgUSiw%40mail.gmail.com.

Philip Jägenstedt

unread,
Jun 20, 2018, 6:36:50 AM6/20/18
to Jochen Eisinger, Mike West, beaufort...@gmail.com, l4462...@gmail.com, blink-dev, Andy Paicu
LGTM3

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CALjhuid%2Bamibz_XWG3MURES-_F-mLSMrfUNme6B%3Den-m%2BH8opQ%40mail.gmail.com.

François Beaufort

unread,
Sep 21, 2018, 4:21:07 AM9/21/18
to blink-dev, joc...@chromium.org, mk...@chromium.org, beaufort...@gmail.com, l4462...@gmail.com, andy...@google.com
As raised in https://github.com/WICG/picture-in-picture/issues/79, we should provide a way to access Picture-in-Picture window when user-agent initiates Picture-in-Picture. We’ve decided to add a pictureInPictureWindow attribute to the enterpictureinpicture event . 
This feature will be fully tested by web-platform-tests.

Note that Picture-in-Picture Web API has not shipped yet.

Fr

unread,
Jun 18, 2020, 12:58:02 AM6/18/20
to blink-dev, Jochen Eisinger, mk...@chromium.org, l4462...@gmail.com, andy...@google.com
As raised by Mozilla folks at https://github.com/w3c/picture-in-picture/issues/188, we should provide a way to access the Picture-in-Picture window when user-agent leaves Picture-in-Picture. To address this issue, we’ve added a new pictureInPictureWindow attribute to the leavepictureinpicture event as it was added previously to the enterpictureinpicture event.

Web platform tests will be updated and available at https://wpt.fyi/results/picture-in-picture.
Reply all
Reply to author
Forward
0 new messages