tor-browser

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

target-current-scroll-marker-update.html (2039B)

      1 <!doctype html>
      2 <meta charset="utf-8">
      3 <title>CSS Test: ::scroll-marker doesn't stay :target-current upon removing scroll-marker-group property</title>
      4 <link rel="help" href="https://drafts.csswg.org/css-overflow-5/#scroll-marker">
      5 <script src="/resources/testharness.js"></script>
      6 <script src="/resources/testharnessreport.js"></script>
      7 <script src="/resources/testdriver.js"></script>
      8 <script src="/resources/testdriver-actions.js"></script>
      9 <script src="/resources/testdriver-vendor.js"></script>
     10 <style>
     11  body {
     12    margin: 0;
     13  }
     14 
     15  #scroller {
     16    width: 600px;
     17    height: 300px;
     18    overflow: auto;
     19    scroll-marker-group: before;
     20    white-space: nowrap;
     21  }
     22 
     23  #scroller div {
     24    background: pink;
     25    display: inline-block;
     26    width: 600px;
     27    height: 270px;
     28  }
     29 
     30  #scroller::scroll-marker-group {
     31    display: flex;
     32    height: 20px;
     33    width: 40px;
     34  }
     35 
     36  #scroller div::scroll-marker {
     37    content: "";
     38    width: 20px;
     39    height: 20px;
     40    background-color: green;
     41    display: inline-block;
     42  }
     43 
     44  #scroller div::scroll-marker:target-current {
     45    background-color: blue;
     46  }
     47 </style>
     48 <div id="scroller">
     49  <div></div>
     50  <div id="item"></div>
     51 </div>
     52 <script>
     53  promise_test(async t => {
     54    let actions_promise = new test_driver.Actions()
     55      .pointerMove(30, 10)
     56      .pointerDown()
     57      .pointerUp()
     58      .send();
     59    await actions_promise;
     60    assert_equals(getComputedStyle(item, "::scroll-marker").backgroundColor, "rgb(0, 0, 255)", "::scroll-marker becomes :target-current upon activation");
     61    scroller.style.setProperty("scroll-marker-group", "none");
     62    scroller.scrollLeft = 0;
     63    assert_equals(getComputedStyle(item, "::scroll-marker").backgroundColor, "", "::scroll-marker doesn't exist without scroll-marker-group property");
     64    scroller.style.setProperty("scroll-marker-group", "before");
     65    assert_equals(getComputedStyle(item, "::scroll-marker").backgroundColor, "rgb(0, 128, 0)", "::scroll-marker doesn't stay :target-current upon setting scroll-marker-group property");
     66  });
     67 </script>