tor-browser

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

test_flex_object.html (2823B)

      1 <!doctype html>
      2 <html>
      3 <head>
      4 <meta charset="utf-8">
      5 <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
      6 <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css" />
      7 <style>
      8 body {
      9  margin: 40px;
     10 }
     11 .flexWrapper {
     12  display: flex;
     13  width: 400px;
     14 }
     15 .nonFlexWrapper {
     16  display: block;
     17  width: 400px;
     18 }
     19 .oh {
     20  overflow: hidden;
     21 }
     22 .box {
     23  background-color: #444;
     24  color: #fff;
     25 }
     26 </style>
     27 
     28 <script>
     29 "use strict";
     30 
     31 SimpleTest.waitForExplicitFinish();
     32 
     33 function runTests() {
     34  // Test 1: elements styled with display:flex
     35  let idsWithFlex = [
     36    "flexDiv",
     37    "flexDivOh",
     38 
     39    "flexFieldset",
     40    "flexFieldsetEmpty",
     41    "flexFieldsetOh",
     42 
     43    "flexButton",
     44    "flexButtonOh",
     45  ];
     46 
     47  for (let id of idsWithFlex) {
     48    let wrapper = document.getElementById(id);
     49 
     50    // Test that we got a flex info object from the element.
     51    let flex = wrapper.getAsFlexContainer();
     52    ok(flex, `Expected that element id ${id} would have flex info.`);
     53  }
     54 
     55  // Test 2: elements styled without display:flex
     56  let idsWithoutFlex = [
     57    "boxA",
     58 
     59    "nonFlexFieldset",
     60    "nonFlexFieldsetOh",
     61 
     62    "nonFlexButton",
     63    "nonFlexButtonOh",
     64  ];
     65 
     66  for (let id of idsWithoutFlex) {
     67    let wrapper = document.getElementById(id);
     68 
     69    // Test that we didn't get a flex info object from the element.
     70    let flex = wrapper.getAsFlexContainer();
     71    ok(!flex, `Expected that element id ${id} would not have flex info.`);
     72  }
     73 
     74  SimpleTest.finish();
     75 }
     76 </script>
     77 </head>
     78 <body onLoad="runTests();">
     79 
     80  <div id="flexDiv" class="flexWrapper">
     81    <div id="boxA" class="box">A</div>
     82  </div>
     83 
     84  <div id="flexDivOh" class="flexWrapper oh">
     85    <div id="boxAOh" class="box">A</div>
     86  </div>
     87 
     88  <fieldset id="flexFieldset" class="flexWrapper">
     89    <legend>a fieldset</legend>
     90    <label for="name">name</label>
     91    <input id="name">
     92  </fieldset>
     93 
     94  <fieldset id="flexFieldsetEmpty" class="flexWrapper">
     95  </fieldset>
     96 
     97  <fieldset id="flexFieldsetOh" class="flexWrapper oh">
     98    <legend>a fieldset</legend>
     99    <label for="nameOh">name</label>
    100    <input id="nameOh">
    101  </fieldset>
    102 
    103  <button id="flexButton" class="flexWrapper">
    104    <span>test</span>
    105  </button>
    106 
    107  <button id="flexButtonOh" class="flexWrapper oh">
    108    <span>test</span>
    109  </button>
    110 
    111  <fieldset id="nonFlexFieldset" class="nonFlexWrapper">
    112    <legend>a fieldset</legend>
    113    <label for="name">name</label>
    114    <input id="name">
    115  </fieldset>
    116 
    117  <fieldset id="nonFlexFieldsetOh" class="nonFlexWrapper oh">
    118    <legend>a fieldset</legend>
    119    <label for="name">name</label>
    120    <input id="name">
    121  </fieldset>
    122 
    123  <button id="nonFlexButton" class="nonFlexWrapper">
    124    <span>test</span>
    125  </button>
    126 
    127  <button id="nonFlexButtonOh" class="nonFlexWrapper oh">
    128    <span>test</span>
    129  </button>
    130 
    131 </body>
    132 </html>