third_party/WebKit/LayoutTests/css3/font-weight-multiple-selectors.html

   1 <html>
   2 <head>
   3 <style>
   4 #outer > div { font-weight: bolder; }
   5 #outer > div#bolder { font-weight: bolder; }
   6 #outer > div#lighter { font-weight: lighter; }
   7 </style>
   8 <script src="../resources/js-test.js"></script>
   9 </head>
  10 <body>
  11 <div id="outer">
  12     <div id="bolder"></div>
  13     <div id="lighter"></div>
  14 </div>
  15 <div id="console"></div>
  16 <script>
  17 description('Test that font-weight: bolder and font-weight: lighter are not cumulative when multiple selectors apply.');
  18
  19 table = [
  20 ["100"   , "100"   , "normal", "100"],
  21 ["200"   , "200"   , "normal", "100"],
  22 ["300"   , "300"   , "normal", "100"],
  23 ["400"   , "normal", "bold"  , "100"],
  24 ["normal", "normal", "bold"  , "100"],
  25 ["500"   , "500"   , "bold"  , "100"],
  26 ["600"   , "600"   , "900"   , "normal"],
  27 ["700"   , "bold"  , "900"   , "normal"],
  28 ["bold"  , "bold"  , "900"   , "normal"],
  29 ["800"   , "800"   , "900"   , "bold"],
  30 ["900"   , "900"   , "900"   , "bold"],
  31 ];
  32
  33 var outer = document.getElementById("outer");
  34 var bolder = document.getElementById("bolder");
  35 var lighter = document.getElementById("lighter");
  36 for(var i=0; i<table.length; i++) {
  37     outer.style.fontWeight = table[i][0];
  38     shouldBeEqualToString('getComputedStyle(outer).fontWeight', table[i][1]);
  39     shouldBeEqualToString('getComputedStyle(bolder).fontWeight', table[i][2]);
  40     shouldBeEqualToString('getComputedStyle(lighter).fontWeight', table[i][3]);
  41 }
  42 </script>
  43 </body>
  44 </html>