To check if a browser supports picture-in-picture mode, you can use the pictureInPictureEnabled property in the global document object in JavaScript.
Picture-in-picture mode is a modern feature in browsers where the user will be able to play a video in an inset window (or a small separate window) even if the user is working on some other programs.
This is how you can check for the availability,
// Check if browser supports picture-in-picture mode
const doesitSupport = document.pictureInPictureEnabled;
console.log(doesitSupport); // true
-
The property returns a boolean
trueif it supports picture-in-picture mode andfalseif not -
The
pictureInPictureEnabledis still in a progress state at the time of the writing of this blog. Be sure to check thepictureInPictureEnabledcompatibility table in caniuse.com.
See the above code live in JSBin.