tor-browser

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

legend.html (1731B)

      1 <!doctype html>
      2 <title>The legend element</title>
      3 <script src=/resources/testharness.js></script>
      4 <script src=/resources/testharnessreport.js></script>
      5 <style>
      6 #ref {
      7  display: block;
      8  unicode-bidi: isolate;
      9  padding-left: 2px;
     10  padding-right: 2px;
     11  /* TODO: uncomment this when these properties are widely supported
     12  padding-inline-start: 2px; padding-inline-end: 2px;
     13  */
     14 }
     15 </style>
     16 
     17 <legend id=in-body></legend>
     18 <fieldset>
     19 <legend id=rendered-legend></legend>
     20 <legend id=in-fieldset-second-child></legend>
     21 <div><legend id=in-fieldset-descendant></legend></div>
     22 </fieldset>
     23 <div id=ref></div>
     24 
     25 <script>
     26 setup(() => {
     27  self.legends = [].slice.call(document.querySelectorAll('legend'));
     28  self.refStyle = getComputedStyle(document.getElementById('ref'));
     29  self.props = ['display',
     30                'unicodeBidi',
     31                'marginTop',
     32                'marginRight',
     33                'marginBottom',
     34                'marginLeft',
     35                'paddingTop',
     36                'paddingRight',
     37                'paddingBottom',
     38                'paddingLeft',
     39                'overflow',
     40                // Extra tests
     41                'height',
     42                'box-sizing',
     43               ];
     44 });
     45 legends.forEach(legend => {
     46  const testStyle = getComputedStyle(legend);
     47  props.forEach(prop => {
     48    test(() => {
     49      assert_equals(testStyle[prop], refStyle[prop]);
     50    }, `${legend.id}: ${prop}`);
     51  });
     52 
     53  // Test width separately since it differs outside fieldset vs. in fieldset vs. rendered legend
     54  test(() => {
     55    if (legend.id === 'rendered-legend') {
     56      assert_equals(testStyle.width, '0px');
     57    } else {
     58      assert_not_equals(testStyle.width, '0px');
     59    }
     60  }, `${legend.id}: width`);
     61 });
     62 </script>