tor-browser

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

highlight-priority.html (2585B)

      1 <!DOCTYPE html>
      2 <html>
      3 <head>
      4    <title>Highlight priority attribute is mutable</title>
      5    <link rel="help" href="https://drafts.csswg.org/css-highlight-api-1/#priorities">
      6    <script src="/resources/testharness.js"></script>
      7    <script src="/resources/testharnessreport.js"></script>
      8    <style>
      9        ::highlight(yellow-highlight) {
     10            background-color: yellow;
     11        }
     12        ::highlight(green-highlight) {
     13            background-color: green;
     14        }
     15        ::highlight(blue-highlight) {
     16            background-color: blue;
     17        }
     18    </style>
     19 </head>
     20 <body>
     21    <span id="green-highlight">Green</span>
     22    <span id="yellow-highlight">Yellow</span>
     23    <span id="blue-highlight">Blue</span>
     24    <span id="yellow-blue-highlight">Yellow-Blue</span>
     25 
     26    <script>
     27    test(() => {
     28        let yellowBlue = document.getElementById("yellow-blue-highlight");
     29 
     30        let green = document.getElementById("green-highlight");
     31        let highlightGreen = new Highlight(new StaticRange({
     32            startContainer: green.childNodes[0],
     33            startOffset: 0,
     34            endContainer: green.childNodes[0],
     35            endOffset: 6
     36        }));
     37 
     38        let yellow = document.getElementById("yellow-highlight");
     39        let highlightYellow = new Highlight(new StaticRange({
     40            startContainer: yellow.childNodes[0],
     41            startOffset: 0,
     42            endContainer: yellow.childNodes[0],
     43            endOffset: 6
     44        }), new StaticRange({
     45            startContainer: yellowBlue.childNodes[0],
     46            startOffset: 0,
     47            endContainer: yellowBlue.childNodes[0],
     48            endOffset: 6
     49        }));
     50 
     51        let blue = document.getElementById("blue-highlight");
     52        let highlightBlue = new Highlight(new StaticRange({
     53            startContainer: blue.childNodes[0],
     54            startOffset: 0,
     55            endContainer: blue.childNodes[0],
     56            endOffset: 4
     57        }), new StaticRange({
     58            startContainer: yellowBlue.childNodes[0],
     59            startOffset: 0,
     60            endContainer: yellowBlue.childNodes[0],
     61            endOffset: 11
     62        }));
     63 
     64        CSS.highlights.set("yellow-highlight", highlightYellow);
     65        CSS.highlights.set("green-highlight", highlightGreen);
     66        CSS.highlights.set("blue-highlight", highlightBlue);
     67 
     68        highlightYellow.priority = 10;
     69        highlightBlue.priority = -1;
     70 
     71        assert_equals(highlightYellow.priority, 10);
     72        assert_equals(highlightGreen.priority, 0);
     73        assert_equals(highlightBlue.priority, -1);
     74    });
     75    </script>
     76 </body>
     77 </html>