tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

recursive-iframe-fullscreen.html (2411B)

      1 <!DOCTYPE html>
      2 <meta charset="utf-8" />
      3 <title>Recursive IFrame Fullscreen API success reporter</title>
      4 <body>
      5  <script src="/resources/testdriver.js"></script>
      6  <script src="/resources/testdriver-vendor.js"></script>
      7  <script src="../../trusted-click.js"></script>
      8  <script>
      9    let child_frame = null;
     10    const events = [];
     11 
     12    document.onfullscreenchange = () => {
     13      events.push("fullscreenchange");
     14    };
     15 
     16    document.onfullscreenerror  = () => {
     17      events.push("fullscreenerror");
     18    };
     19 
     20    function send_report() {
     21      window.top.postMessage(
     22        {
     23          name: window.name,
     24          action: "report",
     25          report: {
     26            api: "fullscreen",
     27            frame: window.name,
     28            fullscreenElementIsNull: document.fullscreenElement === null,
     29            events,
     30          },
     31        },
     32        "*"
     33      );
     34    }
     35 
     36    async function create_child_frame({ src, name, allow_fullscreen }) {
     37      child_frame = document.createElement("iframe");
     38      child_frame.allow = allow_fullscreen ? "fullscreen" : "";
     39      child_frame.name = name;
     40      child_frame.style.width = "100%";
     41      child_frame.style.height = "100%";
     42      document.body.appendChild(child_frame);
     43      await new Promise((resolve) => {
     44        child_frame.addEventListener("load", resolve, { once: true });
     45        child_frame.src = src;
     46      });
     47      window.top.postMessage({ action: "load", name }, "*");
     48    }
     49 
     50    async function go_fullscreen() {
     51      await trusted_click(document.body);
     52      let error;
     53      try {
     54        await document.body.requestFullscreen();
     55      } catch (err) {
     56        error = err.name;
     57      } finally {
     58        window.top.postMessage(
     59          { action: "requestFullscreen", name: window.name, error },
     60          "*"
     61        );
     62      }
     63    }
     64 
     65    window.addEventListener("message", async (e) => {
     66      // Massage is not for us, try to pass it on...
     67      if (e.data.name !== window.name) {
     68        child_frame?.contentWindow.postMessage(e.data, "*");
     69        return;
     70      }
     71      switch (e.data.action) {
     72        case "requestReport":
     73          send_report();
     74          break;
     75        case "requestFullscreen":
     76          await go_fullscreen();
     77          break;
     78        case "addIframe":
     79          await create_child_frame(e.data.iframe);
     80          break;
     81        default:
     82          window.top.postMessage(e.data, "*");
     83      }
     84    });
     85  </script>
     86 </body>