<html>
<head>
<title>Capture Handle Test - Main Capturing Page</title>
<link rel="icon" href="data:," />
<script src="../result_queue.js"></script>
<script>
"use strict";
let capturedStream;
let capturedVideoTrack;
let resultQueue = new ResultQueue();
function captureOtherTab() {
return navigator.mediaDevices
.getDisplayMedia({ video: true, selfBrowserSurface: "include" })
.then(handleCaptureSuccess)
.catch(handleCaptureError);
}
function readLastEvent() {
// Blocks until onCaptureHandleChange() unblocks.
return resultQueue.pop();
}
function readLastEmbeddedEvent() {
// Blocks until the embedded frame's onCaptureHandleChange() unblocks.
return new Promise(resolve => {
window.addEventListener('message', resolve, {once: true});
document
.getElementById("embedded_frame")
.contentWindow.postMessage("last-embedded-event", "*");
}).then((event) => {
return event.data;
});
}
function readCaptureHandle() {
if (!capturedVideoTrack) {
return "error-no-video-track";
}
let captureHandle = capturedVideoTrack.getCaptureHandle();
if (captureHandle === null || captureHandle === undefined) {
return String(captureHandle);
} else if (!captureHandle) {
return "error-unknown-capture-handle";
}
return JSON.stringify(captureHandle);
}
function startEmbeddingFrame(url) {
return new Promise(resolve => {
window.addEventListener('message', resolve, {once: true});
document.getElementById("embedded_frame").src = url;
}).then((event) => {
return event.data;
});
}
function captureOtherTabFromEmbeddedFrame() {
return new Promise(resolve => {
window.addEventListener('message', resolve, {once: true});
document
.getElementById("embedded_frame")
.contentWindow.postMessage("start-capture", "*");
}).then((event) => {
return event.data;
});
}
function readCaptureHandleInEmbeddedFrame() {
return new Promise(resolve => {
window.addEventListener('message', resolve, {once: true});
document
.getElementById("embedded_frame")
.contentWindow.postMessage("read-capture-handle", "*");
}).then((event) => {
return event.data;
});
}
function handleCaptureSuccess(stream) {
if (capturedStream) {
return "error-multiple-captures";
}
capturedStream = stream;
capturedVideoTrack = stream.getVideoTracks()[0];
capturedVideoTrack.oncapturehandlechange = onCaptureHandleChange;
return "capture-success";
}
function handleCaptureError(error) {
return "capture-failure";
}
function onCaptureHandleChange(event) {
// Note that JSON.stringify(null) yields 'null'. On the other hand,
// JSON.stringify(undefined) yields undefined (not the string).
resultQueue.push(JSON.stringify(event.target.getCaptureHandle()));
}
function setTitle(title) {
document.title = title;
return "title-changed";
}
// Duplicated from the captured-page in order to test self-capture.
function callSetCaptureHandleConfig(
exposeOrigin,
handle,
permittedOrigins
) {
navigator.mediaDevices.setCaptureHandleConfig({
exposeOrigin: exposeOrigin,
handle: handle,
permittedOrigins: permittedOrigins,
});
return "capture-handle-set";
}
</script>
</head>
<body>
<h1>Capture Handle Test - Main Capturing Page</h1>
<br/>
<iframe id="embedded_frame" allow="display-capture *"></iframe>
</body>
</html>