tor-browser

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

marker-intrinsic-contribution-001.html (2039B)

      1 <!DOCTYPE html>
      2 <meta charset="utf-8">
      3 <title>CSS Test: intrinsic contribution of ::marker</title>
      4 <link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
      5 <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo">
      6 <link rel="help" href="https://drafts.csswg.org/css-sizing-3/#intrinsic">
      7 <meta name="assert" content="Checks that that outside markers have an intrinsic contribution of 0, and inside markers greater than 0.">
      8 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
      9 <style>
     10 li {
     11  font: 10px/1 Ahem;
     12  border: 5px solid orange;
     13  float: left;
     14  clear: left;
     15 }
     16 .inside {
     17  list-style-position: inside;
     18 }
     19 .symbol {
     20  list-style-type: disc;
     21 }
     22 .decimal {
     23  list-style-type: decimal;
     24 }
     25 .string {
     26  list-style-type: "string";
     27 }
     28 .content::marker {
     29  content: "content";
     30 }
     31 </style>
     32 <div id="log"></div>
     33 <ol class="outside">
     34  <li class="symbol" data-width="0"></li>
     35  <li class="decimal" data-width="0"></li>
     36  <li class="string" data-width="0"></li>
     37  <li class="content" data-width="0"></li>
     38 </ol>
     39 <ol class="inside">
     40  <li class="symbol" data-min-width="0"></li>
     41  <li class="decimal" data-width="30"></li>
     42  <li class="string" data-width="60"></li>
     43  <li class="content" data-width="70"></li>
     44 </ol>
     45 <script src="/resources/testharness.js"></script>
     46 <script src="/resources/testharnessreport.js"></script>
     47 <script>
     48 "use strict";
     49 function check(item, msg) {
     50  test(function() {
     51    if (item.dataset.width) {
     52      assert_equals(item.clientWidth, +item.dataset.width, "clientWidth");
     53    } else {
     54      assert_greater_than(item.clientWidth, +item.dataset.minWidth, "clientWidth");
     55    }
     56  }, msg);
     57 }
     58 
     59 setup({ explicit_done: true });
     60 
     61 document.fonts.ready.then(() => {
     62  for (let item of document.querySelectorAll(".outside > li")) {
     63    check(item, `Intrinsic contribution of outside ${item.className} marker`);
     64  }
     65  for (let item of document.querySelectorAll(".inside > li")) {
     66    check(item, `Intrinsic contribution of inside ${item.className} marker`);
     67  }
     68  done();
     69 });
     70 </script>