document-pip.html | Explore in Territory

<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Document Picture-in-Picture</title>
</head>
<body>
  <video id="video" controls loop></video>
</body>
<script>
const video = document.getElementById("video");

async function loadAndPlayVideo() {
    video.src = "../bigbuck.webm";
    await video.play();
    return true;
}

var pipWindow;
async function createDocumentPipWindow({ width = 300, height = 300, disallowReturnToOpener, preferInitialWindowPlacement } = {}) {
    pipWindow = await documentPictureInPicture.requestWindow({ width, height, disallowReturnToOpener, preferInitialWindowPlacement });
    pipWindow.document.open();
    pipWindow.document.write("Hello, world.<a name='top'>top</a>");
    pipWindow.document.close();
    return true;
}

function navigateInDocumentPipWindow(url) {
    pipWindow.document.location.href = url;
    return true;
}

function addScriptToPictureInPictureWindow() {
    pipWindow.document.write("<script>document.testvalue = 123;<\/script>");
    return pipWindow.document.testvalue == 123;
}

function refreshInDocumentPipWindow() {
    pipWindow.location.reload();
    return true;
}

</script>
chromium/chrome/test/data/media/picture-in-picture/document-pip.html
