tor-browser

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

marker-computed-content.html (1926B)


      1 <!DOCTYPE html>
      2 <meta charset="utf-8">
      3 <title>CSS Pseudo-Elements Test: Computed size of ::marker</title>
      4 <link rel="help" href="https://drafts.csswg.org/css-pseudo-4/#marker-pseudo">
      5 <link rel="help" href="https://drafts.csswg.org/css-content/#content-property">
      6 <link rel="author" title="Oriol Brufau" href="mailto:obrufau@igalia.com">
      7 <meta name="assert" content="This test checks that 'content' resolves correctly in ::marker." />
      8 <link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
      9 <style>
     10 .no-list > li {
     11  display: block;
     12 }
     13 .normal::marker {
     14  content: normal;
     15 }
     16 .string::marker {
     17  content: "string";
     18 }
     19 .image::marker {
     20  content: url("about:invalid");
     21 }
     22 .none::marker {
     23  content: none;
     24 }
     25 </style>
     26 <div id="log"></div>
     27 <ol class="list">
     28  <li class="default">item</li>
     29  <li class="normal">item</li>
     30  <li class="string">item</li>
     31  <li class="image">item</li>
     32  <li class="none">item</li>
     33 </ol>
     34 <ol class="no-list">
     35  <li class="default">item</li>
     36  <li class="normal">item</li>
     37  <li class="string">item</li>
     38  <li class="image">item</li>
     39  <li class="none">item</li>
     40 </ol>
     41 <script src="/resources/testharness.js"></script>
     42 <script src="/resources/testharnessreport.js"></script>
     43 <script>
     44 const expectations = {
     45  default: 'normal',
     46  normal: 'normal',
     47  string: '"string"',
     48  image: 'url("about:invalid")',
     49  none: 'none',
     50 };
     51 for (const target of document.querySelectorAll('.list > li')) {
     52  const {content} = getComputedStyle(target, '::marker');
     53  test(() => {
     54    assert_equals(content, expectations[target.className]);
     55  }, `Computed 'content' for list-item ::marker, variant ${target.className}`);
     56 }
     57 for (const target of document.querySelectorAll('.no-list > li')) {
     58  const {content} = getComputedStyle(target, '::marker');
     59  test(() => {
     60    assert_equals(content, expectations[target.className]);
     61  }, `Computed 'content' for non-list-item ::marker, variant ${target.className}`);
     62 }
     63 </script>