blob: e3b6d379d14ff00b692e726214567401acdeef0e [file] [log] [blame]
<!DOCTYPE html>
<style>
div { width: 0px; height: 0px }
#reflectionOffset { -webkit-box-reflect: right calc(50%) }
#reflectionMask { -webkit-box-reflect: below calc(5px) -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch; }
</style>
<body>
<p>Test calling getPropertyValue on computed styles for -webkit-border-image property.</p>
<pre id="console"></pre>
<div id="reflectionOffset"></div>
<div id="reflectionMask"></div>
</body>
<script>
function log(msg)
{
document.getElementById('console').appendChild(document.createTextNode(msg + '\n'));
}
function subTest(object, property)
{
log(' ' + property);
var value = document.defaultView.getComputedStyle(object, null).getPropertyValue(property);
log(' getPropertyValue: ' + value + (value == 'none' ? ' <- FAIL' : ''));
log(' getPropertyCSSValue: ' + document.defaultView.getComputedStyle(object, null).getPropertyCSSValue(property));
}
function test(id, value)
{
log('-webkit-box-reflect: ' + value + ';');
var object = document.getElementById(id);
subTest(object, '-webkit-box-reflect');
}
if (window.testRunner)
testRunner.dumpAsText();
test('reflectionOffset', 'right calc(50%)');
log('');
test('reflectionMask', 'below calc(5px) -webkit-gradient(linear, 0 0, 0 0) 25 25 25 25 stretch stretch');
</script>