tor-browser

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

test_jsterm_screenshot_command.html (2434B)

      1 <html>
      2  <head>
      3    <meta charset="utf8">
      4    <style>
      5      html, body {
      6        margin: 0;
      7        padding: 0;
      8      }
      9 
     10      body {
     11        --fixed-header-height: 50px;
     12        margin-top: var(--fixed-header-height);
     13      }
     14 
     15      header {
     16          height: var(--fixed-header-height);
     17          background: rgb(255, 0, 0);
     18          position: fixed;
     19          left: 0;
     20          top: 0;
     21          right: 0;
     22          /* Since we may check the background-color, put the text in the center so we don't pick a pixel from the text */
     23          text-align: center;
     24      }
     25 
     26      img {
     27        height: 100px;
     28        width: 100px;
     29      }
     30 
     31      iframe {
     32        display: block;
     33        height: 50px;
     34        border: none;
     35      }
     36 
     37      .overflow {
     38        overflow: scroll;
     39        height: 200vh;
     40        width: 200vw;
     41      }
     42    </style>
     43  </head>
     44  <body>
     45    <header>Fixed header</header>
     46    <iframe id="same-origin-iframe" data-bg-color="rgb(255, 255, 0)"></iframe>
     47    <iframe id="remote-iframe" data-bg-color="rgb(0, 255, 255)"></iframe>
     48    <img id="testImage"></img>
     49    <script>
     50      "use strict";
     51 
     52      async function loadIframe(iframeEl, origin) {
     53        const onIframeLoaded = new Promise(resolve => {
     54          iframeEl.addEventListener("load", resolve, {once: true})
     55        });
     56        const bgColor = iframeEl.getAttribute("data-bg-color");
     57        iframeEl.src =
     58          `${origin}/document-builder.sjs?html=
     59            <style>
     60              html {
     61                background:${bgColor};
     62                text-align: center;
     63              }
     64 
     65              span {
     66                background-color: rgb(0, 100, 0);
     67                /* move the text to right so we can check the span background color from test */
     68                padding-left: 10px;
     69              }
     70            </style>
     71            <span>${origin}</span>`;
     72        await onIframeLoaded;
     73        iframeEl.classList.add("loaded-iframe");
     74      }
     75 
     76      const origin = document.location.origin;
     77      // Since we can't know on which origin the document is loaded, we check it so we
     78      // can pick another one for the remote iframe.
     79      const remoteOrigin = origin.endsWith(".com")
     80        ? origin.replace(".com", ".org")
     81        : origin.replace(".org", ".com");
     82 
     83      loadIframe(document.getElementById("same-origin-iframe"), origin);
     84      loadIframe(document.getElementById("remote-iframe"), remoteOrigin);
     85    </script>
     86  </body>
     87 </html>