| <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> |
