LayoutTests/tiled-drawing/toggle-to-fixed-background.html - WebKit - Git at Google

 <!DOCTYPE html>

 <html>
 <head>
     <style>
         body {
             background-image: linear-gradient(to top, blue, white);
             height: 5000px;
         }

         body.fixed {
             background-attachment: fixed;
         }

         #layers {
             margin: 100px;
             background-color: silver;
         }

         .box {
             height: 100px;
             width: 100px;
             background-color: blue;
         }
         .composited {
             -webkit-transform: translateZ(0);
         }
     </style>
     <script>
         if (window.testRunner) {
             testRunner.dumpAsText();
             testRunner.waitUntilDone();
         }

         function documentLoaded()
         {
             window.setTimeout(doTest, 0);
         }

         function doTest()
         {
             document.body.classList.add('fixed');

             if (window.internals)
                 document.getElementById('layers').textContent = window.internals.layerTreeAsText(document);

             if (window.testRunner)
                 testRunner.notifyDone();
         }
         window.addEventListener('load', documentLoaded, false);
     </script>
 </head>
 <body>

 <p>Toggling to a fixed background on the body should make a layer for the background.</p>
 <div class="composited box">

 </div>
 <pre id="layers"></pre>

 </body>
 </html>
	<!DOCTYPE html>

	<html>
	<head>
	<style>
	body {
	background-image: linear-gradient(to top, blue, white);
	height: 5000px;
	}

	body.fixed {
	background-attachment: fixed;
	}

	#layers {
	margin: 100px;
	background-color: silver;
	}

	.box {
	height: 100px;
	width: 100px;
	background-color: blue;
	}
	.composited {
	-webkit-transform: translateZ(0);
	}
	</style>
	<script>
	if (window.testRunner) {
	testRunner.dumpAsText();
	testRunner.waitUntilDone();
	}

	function documentLoaded()
	{
	window.setTimeout(doTest, 0);
	}

	function doTest()
	{
	document.body.classList.add('fixed');

	if (window.internals)
	document.getElementById('layers').textContent = window.internals.layerTreeAsText(document);

	if (window.testRunner)
	testRunner.notifyDone();
	}
	window.addEventListener('load', documentLoaded, false);
	</script>
	</head>
	<body>

	<p>Toggling to a fixed background on the body should make a layer for the background.</p>
	<div class="composited box">

	</div>
	<pre id="layers"></pre>

	</body>
	</html>