tor-browser

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

test_computed_style_grid_with_pseudo.html (2136B)


      1 <!DOCTYPE HTML>
      2 <html>
      3 <!--
      4 https://bugzilla.mozilla.org/show_bug.cgi?id=1350780
      5 -->
      6 <head>
      7 <title>Test for Bug 1350780</title>
      8 <script src="/tests/SimpleTest/SimpleTest.js"></script>
      9 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
     10 
     11 <style>
     12 #container {
     13  width: 100px;
     14 }
     15 
     16 .gridBefore::before {
     17  content: "";
     18  display: grid;
     19  grid-template-columns: auto;
     20 }
     21 
     22 .gridBeforeNoContent::before {
     23  display: grid;
     24  grid-template-columns: 40px;
     25 }
     26 </style>
     27 
     28 <script type="application/javascript">
     29 
     30 SimpleTest.waitForExplicitFinish();
     31 
     32 function checkTemplateWithData(data) {
     33  let obj = document.createElement("div");
     34 
     35  // We need either a template or an additionalClass.
     36  if (typeof(data.template != "undefined")) {
     37    obj.style.display = "grid";
     38    obj.style.gridTemplateColumns = data.template;
     39  }
     40 
     41  if (typeof(data.additionalClass != "undefined")) {
     42    obj.className = data.additionalClass;
     43  }
     44 
     45  let container = document.getElementById("container");
     46  container.appendChild(obj);
     47 
     48  let computedStyle = getComputedStyle(obj, data.pseudo);
     49  let computedTemplate = computedStyle.getPropertyValue("grid-template-columns");
     50 
     51  let message = "Got expected template with pseudo " + data.pseudo;
     52  if (typeof(data.additionalClass != "undefined")) {
     53    message += " with class " + data.additionalClass;
     54  }
     55  message += ".";
     56 
     57  is(computedTemplate, data.expected, message);
     58 
     59  container.removeChild(obj);
     60 }
     61 
     62 function runTest() {
     63  let dataToTest = [
     64    { template: "40px",
     65      pseudo: "::selection",
     66      expected: "none"},
     67    { template: "40px",
     68      pseudo: "::before",
     69      expected: "none" },
     70    { additionalClass: "gridBefore",
     71      pseudo: "::before",
     72      expected: "100px" },
     73    { additionalClass: "gridBeforeNoContent",
     74      pseudo: "::before",
     75      expected: "40px" },
     76  ];
     77 
     78  for (let i = 0; i < dataToTest.length; ++i) {
     79    checkTemplateWithData(dataToTest[i]);
     80  }
     81 
     82  SimpleTest.finish();
     83 }
     84 
     85 </script>
     86 </head>
     87 <body onload="runTest()">
     88 <div id="container"></div>
     89 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1350780">Mozilla Bug 1350780</a>
     90 </body>
     91 </html>