third_party/WebKit/LayoutTests/fast/css/case-sensitive-attr.html

   1 <!DOCTYPE html>
   2 <script src="../..//resources/js-test.js"></script>
   3 <style type="text/css">
   4     div[attr="caseSensitiveAttr"] {color: green;}
   5     div[attr="caseSensitiveATTR"] {color: blue;}
   6     div[dir="ltr"] {color: red};
   7 </style>
   8 <div id="attr1" attr="caseSensitiveAttr">
   9     This line should be green (attribute value is case sensitive).
  10 </div>
  11 <div id="attr2" attr="caseSensitiveATTR">
  12     This line should be purple (attribute value is case sensitive).
  13 </div>
  14 <div id="attr3" attr="casesensitiveattr">
  15     This line should be black (attribute value is case sensitive).
  16 </div>
  17 <div id="dir1" dir="LTR">
  18     This line should be green (dir attribute is case insensitive).
  19 </body>
  20 <div id="dir2" dir="ltr">
  21     This line should be green (dir attribute is case insensitive).
  22 </body>
  23 <script>
  24     var attr1 = document.getElementById("attr1");
  25     var attr2 = document.getElementById("attr2");
  26     var attr3 = document.getElementById("attr3");
  27     var dir1 = document.getElementById("dir1");
  28     var dir2 = document.getElementById("dir2");
  29
  30     // green
  31     shouldBeEqualToString("window.getComputedStyle(attr1, null).color", "rgb(0, 128, 0)");
  32
  33     // blue
  34     shouldBeEqualToString("window.getComputedStyle(attr2, null).color", "rgb(0, 0, 255)");
  35
  36     // black
  37     shouldBeEqualToString("window.getComputedStyle(attr3, null).color", "rgb(0, 0, 0)");
  38
  39     // red
  40     shouldBeEqualToString("window.getComputedStyle(dir1, null).color", "rgb(255, 0, 0)");
  41
  42     // red
  43     shouldBeEqualToString("window.getComputedStyle(dir2, null).color", "rgb(255, 0, 0)");
  44 </script>