<!DOCTYPE html> <!-- webkit-test-runner [ AsyncOverflowScrollingEnabled=true ] -->
<html>
<head>
    <style>
		.scroller {
			overflow-y: scroll;
			width: 300px;
			height: 300px;
			border: 1px solid black;
		}
		
		.box {
			position: relative;
			margin: 20px;
		    width: 100px;
		    height: 100px;
		    background-color: green;
		}
		
		.spacer {
			height: 200px;
			width: 10px;
			background-color: silver;
		}
		
		.outside {
			position: relative;
			top: -30px;
			left: 50px;
			background-color: gray;
		}
		
    </style>
	<script>
		if (window.testRunner)
			testRunner.dumpAsText();

		window.addEventListener('load', () => {
			if (window.testRunner)
				document.getElementById('layers').innerText = window.internals.layerTreeAsText(document);
		}, false);
	</script>
</head>
<body>
	<div class="scroller">
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
	</div>
	<div class="outside box"></div>
<pre id="layers">Layer tree goes here</pre>
</body>
</html>