third_party/WebKit/LayoutTests/css3/calc/reflection-computed-style.html

   1 <!DOCTYPE html>
   2 <style>
   3     div { width: 0px; height: 0px }
   4     #reflectionOffset    { -webkit-box-reflect: right calc(50%) }
   5     #reflectionMask      { -webkit-box-reflect: below calc(5px) -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch; }
   6 </style>
   7 <body>
   8     <p>Test calling getPropertyValue on computed styles for -webkit-border-image property.</p>
   9     <pre id="console"></pre>
  10
  11     <div id="reflectionOffset"></div>
  12     <div id="reflectionMask"></div>
  13 </body>
  14 <script>
  15     function log(msg)
  16     {
  17         document.getElementById('console').appendChild(document.createTextNode(msg + '\n'));
  18     }
  19
  20     function subTest(object, property)
  21     {
  22         log('  ' + property);
  23         var value = document.defaultView.getComputedStyle(object, null).getPropertyValue(property);
  24         log('    getPropertyValue:    ' + value + (value == 'none' ? ' <- FAIL' : ''));
  25     }
  26
  27     function test(id, value)
  28     {
  29         log('-webkit-box-reflect: ' + value + ';');
  30         var object = document.getElementById(id);
  31         subTest(object, '-webkit-box-reflect');
  32     }
  33
  34     if (window.testRunner)
  35         testRunner.dumpAsText();
  36     test('reflectionOffset', 'right calc(50%)');
  37     log('');
  38     test('reflectionMask', 'below calc(5px) -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch');
  39 </script>
  40