tor-browser

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

file_fullscreen-backdrop.html (3017B)

      1 <!DOCTYPE html>
      2 <html lang="en">
      3 <head>
      4  <meta charset="UTF-8">
      5  <title>Test for Bug 1064843</title>
      6  <style id="style"></style>
      7  <script src="/tests/SimpleTest/SimpleTest.js"></script>
      8  <script src="/tests/SimpleTest/EventUtils.js"></script>
      9  <script src="/tests/SimpleTest/WindowSnapshot.js"></script>
     10  <script type="text/javascript" src="file_fullscreen-utils.js"></script>
     11  <style>
     12    html {
     13      overflow: hidden;
     14    }
     15    #placeholder {
     16      height: 1000vh;
     17    }
     18  </style>
     19 </head>
     20 <body>
     21 <div id="fullscreen"></div>
     22 <div id="placeholder"></div>
     23 <script>
     24 
     25 const gStyle = document.getElementById("style");
     26 const gFullscreen = document.getElementById("fullscreen");
     27 
     28 function is(a, b, msg) {
     29  opener.is(a, b, "[backdrop] " + msg);
     30 }
     31 
     32 function isnot(a, b, msg) {
     33  opener.isnot(a, b, "[backdrop] " + msg);
     34 }
     35 
     36 function ok(cond, msg) {
     37  opener.ok(cond, "[backdrop] " + msg);
     38 }
     39 
     40 function info(msg) {
     41  opener.info("[backdrop] " + msg);
     42 }
     43 
     44 function synthesizeMouseAtWindowCenter() {
     45  synthesizeMouseAtPoint(innerWidth / 2, innerHeight / 2, {});
     46 }
     47 
     48 const gFullscreenElementBackground = getComputedStyle(gFullscreen).background;
     49 
     50 function begin() {
     51  info("The default background of window should be white");
     52  assertWindowPureColor(window, "white");
     53  addFullscreenChangeContinuation("enter", enterFullscreen);
     54  gFullscreen.requestFullscreen();
     55 }
     56 
     57 function setBackdropStyle(style) {
     58  gStyle.textContent = `#fullscreen::backdrop { ${style} }`;
     59 }
     60 
     61 function enterFullscreen() {
     62  is(getComputedStyle(gFullscreen).background, gFullscreenElementBackground,
     63     "Computed background of #fullscreen shouldn't be changed");
     64 
     65  info("The default background of backdrop for fullscreen is black");
     66  assertWindowPureColor(window, "black");
     67 
     68  setBackdropStyle("background: green");
     69  info("The background color of backdrop should be changed to green");
     70  assertWindowPureColor(window, "green");
     71 
     72  gFullscreen.style.background = "blue";
     73  info("The blue fullscreen element should cover the backdrop");
     74  assertWindowPureColor(window, "blue");
     75 
     76  gFullscreen.style.background = "";
     77  setBackdropStyle("display: none");
     78  info("The white body should be shown when the backdrop is hidden");
     79  assertWindowPureColor(window, "white");
     80 
     81  setBackdropStyle("");
     82  info("Content should return to black because we restore the backdrop");
     83  assertWindowPureColor(window, "black");
     84 
     85  gFullscreen.style.display = "none";
     86  info("The backdrop should disappear with the fullscreen element");
     87  assertWindowPureColor(window, "white");
     88 
     89  gFullscreen.style.display = "";
     90  setBackdropStyle("position: absolute");
     91  info("Changing position shouldn't immediately affect the view");
     92  assertWindowPureColor(window, "black");
     93 
     94  window.scroll(0, screen.height);
     95  info("Scrolled up the absolutely-positioned element");
     96  assertWindowPureColor(window, "white");
     97 
     98  addFullscreenChangeContinuation("exit", exitFullscreen);
     99  document.exitFullscreen();
    100 }
    101 
    102 function exitFullscreen() {
    103  opener.nextTest();
    104 }
    105 </script>
    106 </body>
    107 </html>