tor-browser

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

flexbox-float-1c.xhtml (2358B)

      1 <?xml version="1.0" encoding="UTF-8"?>
      2 <!--
      3     Any copyright is dedicated to the Public Domain.
      4     http://creativecommons.org/publicdomain/zero/1.0/
      5 -->
      6 <!--
      7     This test is like flexbox-float-1a.xhtml, but with the float-styled
      8     element dynamically inserted.
      9 -->
     10 <html xmlns="http://www.w3.org/1999/xhtml" class="reftest-wait">
     11  <head>
     12    <script>
     13      function generateFloat(aFloatDirection) {
     14        var newElem = document.createElement("span");
     15        newElem.setAttribute("style", "float: " + aFloatDirection);
     16        newElem.innerHTML = aFloatDirection == "left" ? "[[[" : "]]]";
     17        return newElem;
     18      }
     19 
     20      function tweak() {
     21        var containerList = document.getElementsByClassName("flexbox");
     22        for (var i = 0; i &lt; containerList.length; i++) {
     23          var container = containerList[i];
     24          var newElem = generateFloat(container.getAttribute("floatValToUse"));
     25 
     26          var nodeToInsertBefore;
     27          var insertPosn = container.getAttribute("insertPosn");
     28          if (insertPosn == "begin") {
     29            nodeToInsertBefore = container.firstChild;
     30          } else if (insertPosn == "mid") {
     31            nodeToInsertBefore = container.firstChild.nextSibling;
     32          } else if (insertPosn == "end") {
     33            nodeToInsertBefore = null;
     34          }
     35 
     36          container.insertBefore(newElem, nodeToInsertBefore);
     37        }
     38 
     39        document.documentElement.removeAttribute("class");
     40      }
     41 
     42      window.addEventListener("MozReftestInvalidate", tweak, false);
     43    </script>
     44    <style>
     45      div.flexbox {
     46        display: flex;
     47        width: 400px;
     48        margin-bottom: 2px;
     49        font-family: sans-serif;
     50        background: lightgreen;
     51        justify-content: space-around;
     52      }
     53    </style>
     54  </head>
     55  <body>
     56    <div class="flexbox" floatValToUse="left" insertPosn="mid">
     57      aaa<span>bbb</span>
     58    </div>
     59    <div class="flexbox" floatValToUse="right" insertPosn="mid">
     60      aaa<span>bbb</span>
     61    </div>
     62    <div class="flexbox" floatValToUse="left" insertPosn="end">
     63      aaa
     64    </div>
     65    <div class="flexbox" floatValToUse="right" insertPosn="end">
     66      aaa
     67    </div>
     68    <div class="flexbox" floatValToUse="left" insertPosn="begin">
     69      bbb
     70    </div>
     71    <div class="flexbox" floatValToUse="right" insertPosn="begin">
     72      bbb
     73    </div>
     74  </body>
     75 </html>