tor-browser

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

test_bug557726.html (3799B)

      1 <!DOCTYPE HTML>
      2 <html>
      3 <!--
      4 https://bugzilla.mozilla.org/show_bug.cgi?id=557726
      5 -->
      6 <head>
      7  <title>Test for Bug 557726</title>
      8  <script src="/tests/SimpleTest/SimpleTest.js"></script>
      9  <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
     10  <style id="pseudo-style">
     11    #div1 {
     12      color: blue;
     13    }
     14 
     15    #div1:first-letter {
     16      font-weight: bold;
     17    }
     18 
     19    #div1:before {
     20      content: '"';
     21    }
     22 
     23    #div1:after {
     24      content: '"';
     25    }
     26 
     27    #div1:after, #div1:before {
     28      color: red;
     29    }
     30 
     31    ::selection {
     32      background: pink;
     33    }
     34 
     35    ::highlight(search) {
     36      background: yellow;
     37    }
     38 
     39    ::highlight(whatever) {
     40      background: tomato;
     41    }
     42  </style>
     43 </head>
     44 <body>
     45 
     46 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=557726">Mozilla Bug 557726</a>
     47 
     48 <div id="div1">
     49  text with ::before, ::after, and ::first-letter pseudo-elements
     50 </div>
     51 
     52 <script type="application/javascript">
     53 
     54 /** Test for Bug 557726 */
     55 const InspectorUtils = SpecialPowers.InspectorUtils;
     56 
     57 function getSelectors (rules) {
     58  var styleElement = document.getElementById("pseudo-style");
     59  var selectors = [];
     60  for (var i = 0; i < rules.length; i++) {
     61    var rule = rules[i];
     62    if (SpecialPowers.unwrap(rule.parentStyleSheet.ownerNode) == styleElement) // no user agent rules
     63      selectors.push(rule.selectorText);
     64  }
     65  return selectors;
     66 }
     67 
     68 var div = document.getElementById("div1");
     69 
     70 /* empty or missing pseudo-element argument */
     71 var selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div));
     72 is(selectors.length, 1, "psuedo-element argument should be optional");
     73 is(selectors[0], "#div1", "should only have the non-pseudo element rule");
     74 
     75 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, ""));
     76 is(selectors.length, 1, "pseudo-element argument can be empty string");
     77 is(selectors[0], "#div1", "should only have the non pseudo-element rule");
     78 
     79 
     80 /* invalid pseudo-element argument */
     81 var rules = InspectorUtils.getMatchingCSSRules(div, "not a valid pseudo element");
     82 is(rules.length, 0, "invalid pseudo-element returns no rules");
     83 
     84 
     85 /* valid pseudo-element argument */
     86 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, ":first-letter"));
     87 is(selectors.length, 1, "pseudo-element argument can be used");
     88 is(selectors[0], "#div1::first-letter", "should only have the ::first-letter rule");
     89 
     90 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, ":before"));
     91 is(selectors.length, 2, "::before pseudo-element has two matching rules");
     92 isnot(selectors.indexOf("#div1::after, #div1::before"), -1, "fetched rule for ::before")
     93 isnot(selectors.indexOf("#div1::before"), -1, "fetched rule for ::before")
     94 
     95 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, ":first-line"));
     96 is(selectors.length, 0, "valid pseudo-element but no matching rules");
     97 
     98 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, "::selection"));
     99 is(selectors.length, 1, "::selection pseudo-element has a matching rule");
    100 is(selectors[0], "::selection", "fetched rule for ::selection");
    101 
    102 const range = new Range();
    103 range.setStart(div.firstChild, 10);
    104 range.setEnd(div.firstChild, 20);
    105 const highlight = new Highlight(range);
    106 CSS.highlights.set("search", highlight);
    107 
    108 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, "::highlight(search)"));
    109 is(selectors.length, 1, "::highlight(search) pseudo-element has a matching rule");
    110 is(selectors[0], "::highlight(search)", "fetched ::highlight(search) rule");
    111 
    112 selectors = getSelectors(InspectorUtils.getMatchingCSSRules(div, "::highlight(whatever)"));
    113 is(selectors.length, 1, "::highlight(whatever) pseudo-element has a matching rule");
    114 is(selectors[0], "::highlight(whatever)", "fetched ::highlight(whatever) rule");
    115 
    116 </script>
    117 </pre>
    118 </body>
    119 </html>