| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| #borderImageNone { -webkit-border-image: none } |
| #borderImageStretch { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch; } |
| #borderImageRepeat { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 50 repeat; } |
| #borderImageWidth { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 / 20 20 20 20 repeat; } |
| #borderImageWidth2 { -webkit-border-image: -webkit-gradient(linear, 0 0, 0 0) 50 / 20 stretch stretch; } |
| </style> |
| <script type="text/javascript"> |
| function log(msg) |
| { |
| document.getElementById('console').appendChild(document.createTextNode(msg + '\n')); |
| } |
| |
| function subTest(ob, prop) |
| { |
| log(' ' + prop); |
| log(' getPropertyValue: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue(prop)); |
| log(' getPropertyCSSValue: ' + document.defaultView.getComputedStyle(ob, null).getPropertyCSSValue(prop)); |
| } |
| |
| function test(id, val) |
| { |
| log('-webkit-border-image: ' + val + ';'); |
| var ob = document.getElementById(id); |
| subTest(ob, '-webkit-border-image'); |
| } |
| |
| function runTests() |
| { |
| if (window.testRunner) |
| testRunner.dumpAsText(); |
| |
| test('borderImageNone', 'none'); |
| |
| log(''); |
| |
| test('borderImageStretch', '-webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch'); |
| |
| log(''); |
| |
| test('borderImageRepeat', '-webkit-gradient(linear, 0 0, 0 0) 50 repeat'); |
| |
| log(''); |
| |
| test('borderImageWidth', '-webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 / 20 20 20 20 repeat'); |
| |
| log(''); |
| |
| test('borderImageWidth2', '-webkit-gradient(linear, 0 0, 0 0) 50 / 20 stretch stretch'); |
| } |
| </script> |
| </head> |
| <body onload="runTests();"> |
| <p>Test calling getPropertyValue on computed styles for -webkit-border-image property.</p> |
| <pre id="console"></pre> |
| |
| <div id="borderImageNone"></div> |
| <div id="borderImageStretch"></div> |
| <div id="borderImageRepeat"></div> |
| <div id="borderImageWidth"></div> |
| <div id="borderImageWidth2"></div> |
| </body> |
| </html> |
