third_party/WebKit/LayoutTests/fast/css/getComputedStyle/getComputedStyle-border-image.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4     <style>
   5         #borderImageNone { -webkit-border-image: none }
   6         #borderImageStretch { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch; }
   7         #borderImageRepeat { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 50 repeat; }
   8         #borderImageWidth { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 / 20 20 20 20 repeat; }
   9         #borderImageWidth2 { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 50 / 20 stretch stretch; }
  10     </style>
  11     <script type="text/javascript">
  12         function log(msg)
  13         {
  14             document.getElementById('console').appendChild(document.createTextNode(msg + '\n'));
  15         }
  16
  17         function subTest(ob, prop)
  18         {
  19             log('  ' + prop);
  20             log('    getPropertyValue:    ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue(prop));
  21         }
  22
  23         function test(id, val)
  24         {
  25             log('-webkit-border-image: ' + val + ';');
  26             var ob = document.getElementById(id);
  27             subTest(ob, '-webkit-border-image');
  28         }
  29
  30         function runTests()
  31         {
  32             if (window.testRunner)
  33                 testRunner.dumpAsText();
  34
  35             test('borderImageNone', 'none');
  36
  37             log('');
  38
  39             test('borderImageStretch', '-webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch');
  40
  41             log('');
  42
  43             test('borderImageRepeat', '-webkit-gradient(linear, 0 0, 0 0) 50 repeat');
  44
  45             log('');
  46
  47             test('borderImageWidth', '-webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 / 20 20 20 20 repeat');
  48
  49             log('');
  50
  51             test('borderImageWidth2', '-webkit-gradient(linear, 0 0, 0 0) 50 / 20 stretch stretch');
  52         }
  53     </script>
  54 </head>
  55 <body onload="runTests();">
  56     <p>Test calling getPropertyValue on computed styles for -webkit-border-image property.</p>
  57     <pre id="console"></pre>
  58
  59     <div id="borderImageNone"></div>
  60     <div id="borderImageStretch"></div>
  61     <div id="borderImageRepeat"></div>
  62     <div id="borderImageWidth"></div>
  63     <div id="borderImageWidth2"></div>
  64 </body>
  65 </html>