third_party/WebKit/LayoutTests/fast/css/getComputedStyle/getComputedStyle-with-before-element.html

   1 <!DOCTYPE html>
   2 <script src="../../../resources/js-test.js"></script>
   3 <style>
   4 #t1::before { color: green }
   5 #t2::before { display: none; content: "X"; color: green; }
   6 #t3::before { display: none; color: green; }
   7 #t4 { display: none; }
   8 #t4::before { content: "X"; color: green; }
   9 #t5 { display: none; }
  10 #t5::before { color: green; }
  11 #t6 { color: green; }
  12 </style>
  13 <div id="t1"></div>
  14 <div id="t2"></div>
  15 <div id="t3"></div>
  16 <div id="t4"></div>
  17 <div id="t5"></div>
  18 <div id="t6"></div>
  19 <script>
  20 description("Check getComputedStyle for ::before with various combinations of display and content.");
  21
  22 var expectedDisplay = [
  23     "'inline'",
  24     "'none'",
  25     "'none'",
  26     "'inline'",
  27     "'inline'",
  28     "'inline'"
  29 ];
  30
  31 for (var i=0; i<6; i++) {
  32
  33     var computed = getComputedStyle(document.getElementById("t"+(i+1)), "::before");
  34
  35     shouldBe("computed.color", "'rgb(0, 128, 0)'");
  36     shouldBe("computed.display", expectedDisplay[i]);
  37 }
  38
  39 </script>