third_party/WebKit/LayoutTests/fast/css/getComputedStyle/getComputedStyle-borderRadius-2.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <script src="../../../resources/js-test.js"></script>
   5 <style>
   6     .test { float: left; width: 50px; height: 50px; border: 1px solid black; }
   7     #borderRadius1 { border-radius: 0 0 10px 10px; }
   8     #borderRadius2 { border-radius: 0 0 0 10px; }
   9     #borderRadius3 { border-radius: 0 0 10px; }
  10     #borderRadius4 { border-radius: 0 10px; }
  11     #borderRadius5 { border-radius: 10px; }
  12 </style>
  13 </head>
  14 <body>
  15     <pre id="console"></pre>
  16     <div class="test" id="borderRadius1"></div>
  17     <div class="test" id="borderRadius2"></div>
  18     <div class="test" id="borderRadius3"></div>
  19     <div class="test" id="borderRadius4"></div>
  20     <div class="test" id="borderRadius5"></div>
  21     <div class="test" id="NoBorderRadius"></div>
  22 <script>
  23 description('Test calling getPropertyValue on computed styles for border radius shorthand properties.');
  24
  25 shouldBe("window.getComputedStyle(document.getElementById('borderRadius1')).getPropertyValue('border-radius')", "'0px 0px 10px 10px'");
  26 shouldBe("window.getComputedStyle(document.getElementById('borderRadius2')).getPropertyValue('border-radius')", "'0px 0px 0px 10px'");
  27 shouldBe("window.getComputedStyle(document.getElementById('borderRadius3')).getPropertyValue('border-radius')", "'0px 0px 10px'");
  28 shouldBe("window.getComputedStyle(document.getElementById('borderRadius4')).getPropertyValue('border-radius')", "'0px 10px'");
  29 shouldBe("window.getComputedStyle(document.getElementById('borderRadius5')).getPropertyValue('border-radius')", "'10px'");
  30 shouldBe("window.getComputedStyle(document.getElementById('NoBorderRadius')).getPropertyValue('border-radius')", "'0px'");
  31 </script>
  32 </body>
  33 </html>