tor-browser

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

recursive-iframe-fullscreen.html (2545B)

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