blob: dc1c9911e770acc862bea6229561aadc3510e80c [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<style>
video {
background-color: gray;
width: 500px;
height: 225px;
border-radius: 200px 0px 100px 0px;
box-shadow: 0 0 8px 8px red;
margin: 10px;
transform: translateZ(0);
}
</style>
<script>
if (window.testRunner) {
testRunner.waitUntilDone();
}
function canPlay() {
setTimeout(function() {
if (window.testRunner)
testRunner.notifyDone();
}, 0);
}
</script>
</head>
<body>
<h3>It passes if:</h3>
<ul>
<li>the video content has rounded corners (top left and bottom right)</li>
<li>the remaining space is gray and has same rounded corners as video content</li>
<li>has box shadow around the video element</li>
</ul>
<video src='../../media/resources/frame_size_change.webm' oncanplaythrough='canPlay();'></video>
</body>
</html>