LayoutTests/compositing/overflow/overflow-compositing-descendant.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
   <style type="text/css" media="screen">

     .movie {
         position: absolute;
         overflow: hidden;
         height: 200px;
         width: 110px;
         padding: 10px;
         background-color: white;
         border: 1px solid black;
     }

     video {
         background-color: black;
     }

     .box {
       width: 100px;
       height: 100px;
     }

     .test {
         position: relative;
         margin-top: -100px;
         background-color: green;
     }

     .indicator {
         background-color: red;
     }
   </style>
   <script type="text/javascript" charset="utf-8">
     if (window.layoutTestController)
       layoutTestController.waitUntilDone();
   </script>
 </head>
 <body>

     <p>You should see a green box under the video. If you see red, the test failed.</p>
     <div class="movie content">
         <video height="100" width="100"></video>
         <div class="indicator box"></div>
         <div class="test box"></div>
     </div>

     <script type="text/javascript" charset="utf-8">
       var video = document.getElementsByTagName('video')[0];
       video.src = '../resources/video.' + (video.canPlayType('video/ogg') ? 'ogv' : 'mp4');
       video.addEventListener('canplaythrough', function() {
         if (window.layoutTestController)
           layoutTestController.notifyDone();
       }, false);
     </script>

 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<style type="text/css" media="screen">

	.movie {
	position: absolute;
	overflow: hidden;
	height: 200px;
	width: 110px;
	padding: 10px;
	background-color: white;
	border: 1px solid black;
	}

	video {
	background-color: black;
	}

	.box {
	width: 100px;
	height: 100px;
	}

	.test {
	position: relative;
	margin-top: -100px;
	background-color: green;
	}

	.indicator {
	background-color: red;
	}
	</style>
	<script type="text/javascript" charset="utf-8">
	if (window.layoutTestController)
	layoutTestController.waitUntilDone();
	</script>
	</head>
	<body>

	<p>You should see a green box under the video. If you see red, the test failed.</p>
	<div class="movie content">
	<video height="100" width="100"></video>
	<div class="indicator box"></div>
	<div class="test box"></div>
	</div>

	<script type="text/javascript" charset="utf-8">
	var video = document.getElementsByTagName('video')[0];
	video.src = '../resources/video.' + (video.canPlayType('video/ogg') ? 'ogv' : 'mp4');
	video.addEventListener('canplaythrough', function() {
	if (window.layoutTestController)
	layoutTestController.notifyDone();
	}, false);
	</script>

	</body>
	</html>