chromium/chrome/test/data/webrtc/capturing_page_embedded.html

<html>
  <head>
    <title>Capture Handle Test - Embedded 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 readCaptureHandle() {
        if (!capturedVideoTrack) {
          return "error-no-video-track";
        }

        let captureHandle = capturedVideoTrack.getCaptureHandle();
        if (!captureHandle) {
          return "no-embedded-capture-handle";
        }

        return JSON.stringify(captureHandle);
      }

      function handleCaptureSuccess(stream) {
        if (capturedStream) {
          return "error-multiple-embedded-captures";
        }

        capturedStream = stream;
        capturedVideoTrack = stream.getVideoTracks()[0];

        capturedVideoTrack.oncapturehandlechange = onCaptureHandleChange;

        return "embedded-capture-success";
      }

      function handleCaptureError(error) {
        return "embedded-capture-failure";
      }

      function onCaptureHandleChange(event) {
        resultQueue.push(JSON.stringify(event.target.getCaptureHandle()));
      }

      function reportEmbeddingSuccess() {
        window.parent.postMessage("embedding-done", '*');
      }

      window.addEventListener("message", (event) => {
        if (event.data == "start-capture") {
          captureOtherTab().then((result) => {
            event.source.postMessage(result, '*');
          });
        } else if (event.data == "read-capture-handle") {
          event.source.postMessage(readCaptureHandle(), '*');
        } else if (event.data == "last-embedded-event") {
          readLastEvent().then((result) => {
            event.source.postMessage(result, '*');
          });
        } else {
          throw new Error("unrecognized-message");
        }
      });
    </script>
  </head>
  <body onload="reportEmbeddingSuccess();">
    <h1>Capture Handle Test - Embedded Capturing Page</h1>
  </body>
</html>