[BUG] Picture-in-picture goes black when content auto-advances to the next canvas

[elynema]

Description

When content auto-plays to the next canvas, if picture-in-picture playback mode has been selected in the browser, the picture-in-picture window just goes black and content begins playing in the main media player window. This would not be so bad, except the picture-in-picture window just lingers there without automatically closing.

In Avalon, this manifests on both media items and playlists, since auto-advance happens in both places.

This video is from an iPhone, but this also happens in both Safari and Chrome on macOS, so presumably it is happening everywhere.

Private Zenhub Video

Behavior with a Youtube playlist has content advancing to the next item in the picture-in-picture window, rather than reverting to the main player.

[joncameron]

We don't have any custom PiP code; it's all Video.js and browser.

[joncameron]

Keeping the same player and switching source might be better than the teardown/rebuild model which may be resulting in the browser losing context when the video source is switched in Ramp/Avalon.

[joncameron]

Keep and retest once the full-screen issue has been QA'd. (#399)