| <!DOCTYPE html> |
| <html> |
| <head> |
| <style> |
| .test { float: left; width: 50px; height: 50px; border: 1px solid black; } |
| #topRightDiff { -webkit-border-top-right-radius: 10px 20px; } |
| #topRightSame {-webkit-border-top-right-radius: 10px; } |
| #topLeftDiff { -webkit-border-top-left-radius: 10px 20px; } |
| #topLeftSame { -webkit-border-top-left-radius: 10px; } |
| #bottomRightDiff { -webkit-border-bottom-right-radius: 10px 20px; } |
| #bottomRightSame { -webkit-border-bottom-right-radius: 10px; } |
| #bottomLeftDiff { -webkit-border-bottom-left-radius: 10px 20px; } |
| #bottomLeftSame { -webkit-border-bottom-left-radius: 10px; } |
| </style> |
| <script type="text/javascript"> |
| function log(msg) |
| { |
| document.getElementById('console').appendChild(document.createTextNode(msg + '\n')); |
| } |
| |
| function runTests() |
| { |
| if (window.layoutTestController) |
| layoutTestController.dumpAsText(); |
| |
| var ob = document.getElementById('topRightDiff'); |
| log('-webkit-border-top-right-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-top-right-radius')); |
| ob = document.getElementById('topRightSame'); |
| log('-webkit-border-top-right-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-top-right-radius')); |
| ob = document.getElementById('topLeftDiff'); |
| log('-webkit-border-top-left-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-top-left-radius')); |
| ob = document.getElementById('topLeftSame'); |
| log('-webkit-border-top-left-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-top-left-radius')); |
| ob = document.getElementById('bottomRightDiff'); |
| log('-webkit-border-bottom-right-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-bottom-right-radius')); |
| ob = document.getElementById('bottomRightSame'); |
| log('-webkit-border-bottom-right-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-bottom-right-radius')); |
| ob = document.getElementById('bottomLeftDiff'); |
| log('-webkit-border-bottom-left-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-bottom-left-radius')); |
| ob = document.getElementById('bottomLeftSame'); |
| log('-webkit-border-bottom-left-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-bottom-left-radius')); |
| |
| log(''); |
| |
| log('Test getting 0px value border radius.') |
| ob = document.getElementById('topRightDiff'); |
| log('-webkit-border-top-right-radius: ' + document.defaultView.getComputedStyle(ob, null).getPropertyValue('-webkit-border-top-left-radius')); |
| } |
| </script> |
| </head> |
| <body onload="runTests();"> |
| <p>Test calling getPropertyValue on computed styles for border radius properties.</p> |
| <pre id="console"></pre> |
| |
| <div class="test" id="topRightDiff"></div> |
| <div class="test" id="topRightSame"></div> |
| <div class="test" id="topLeftDiff"></div> |
| <div class="test" id="topLeftSame"></div> |
| <div class="test" id="bottomRightDiff"></div> |
| <div class="test" id="bottomRightSame"></div> |
| <div class="test" id="bottomLeftDiff"></div> |
| <div class="test" id="bottomLeftSame"></div> |
| <script> |
| </script> |
| </body> |
| </html> |