pip prop does not initiate pip

[readeral]

Be sure to search for your issue before opening a new one.

Current Behavior

pip prop doesn't actually enable pip. Using the demo app, pip control is never showing up in the regardless of source, and using React dev tools to toggle the prop on and off does nothing.

Expected Behavior

Expected to see the pip control button at least for something... and expected toggling the pip prop to turn pip on

Steps to Reproduce

1. Visit https://cookpete.com/react-player/
2. Load every test source

Environment

• URL attempting to play: https://cookpete.com/react-player/
• Browser: Chrome/Safari
• Operating system: MacOS 10.14.5
• jsFiddle example: n/a but fwiw doesn't work if adding a pip prop to this either https://jsfiddle.net/86ewraov/

Other Information

[readeral]

I've tried using a ref to initiate pip on the video object - but the

I don't know enough about refs to know if I can target the

[cookpete]

If manually calling requestPictureInPicture on the element is working then something weird must be going on, as that's exactly what ReactPlayer does

Note that pip is only currently supported when playing video files in recent versions of Chrome. I can visit https://cookpete.com/react-player in Chrome 76 on macOS and PIP works fine for any of the Files URLs (apart from the mp3):

Also note that there is a static method to check if PIP is supported: ReactPlayer.canEnablePiP(url)

[readeral]

Ah.. "when playing video files" is the key. I didn't get as far down the list as testing the files - gave up at DailyMotion! Thanks for helping me troubleshoot.

I couldn't determine that this is a limitation to the Chrome implementation. Can you point me in the direction of where to find info on this?

Would also be helpful to have this limitation visible in the Readme :)

[cookpete]

I couldn't determine that this is a limitation to the Chrome implementation. Can you point me in the direction of where to find info on this?

https://developers.google.com/web/updates/2018/10/watch-video-using-picture-in-picture

[kenakingkong]

Did you figure out how to work PiP with the youtube & other embeds?

[readeral]

@kenakingkong it's a limitation of the API that you need to have access to the <video> tag, and where youtube et al use iframe, you run into same-origin issues trying to reach in and call the PIP function. So until these streaming providers expose an API for PIP that is easily included in this library, we're stuck with file-only PIP.