LayoutTests/compositing/visibility/visibility-simple-webgl-layer.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
   <head>
     <style>
       canvas {
           background-color: rgba(0, 0, 0, 1);
       }

       .hidden {
           visibility: hidden;
       }

       .visible {
           visibility: visible;
       }
     </style>

     <script>
       if (window.testRunner) {
           testRunner.dumpAsText(true);
           testRunner.overridePreference("WebKitWebGLEnabled", "1");
       }

       function drawCanvas(canvasID, clearColor)
       {
           var theCanvas = document.getElementById(canvasID);
           var glContext = theCanvas.getContext("experimental-webgl");
           glContext.clearColor(clearColor[0], clearColor[1], clearColor[2], clearColor[3]);
           glContext.clear(glContext.COLOR_BUFFER_BIT);
       }

       function init()
       {
           drawCanvas("topGL", [0, 0.5, 0, 1]);
           drawCanvas("bottomGL", [1, 0, 0, 1]);
       }
     </script>
   </head>

   <body onload="init()">
     <!-- Tests CSS visibility flag for WebGL layers. -->
     <!-- Pixel test only. Only the green webGL canvas should be visible. The red one should be hidden. -->
     <div><canvas id="topGL" class="visible" width="150" height="150"></canvas></div>
     <div><canvas id="bottomGL" class="hidden" width="150" height="150"></canvas></div>
   </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<style>
	canvas {
	background-color: rgba(0, 0, 0, 1);
	}

	.hidden {
	visibility: hidden;
	}

	.visible {
	visibility: visible;
	}
	</style>

	<script>
	if (window.testRunner) {
	testRunner.dumpAsText(true);
	testRunner.overridePreference("WebKitWebGLEnabled", "1");
	}

	function drawCanvas(canvasID, clearColor)
	{
	var theCanvas = document.getElementById(canvasID);
	var glContext = theCanvas.getContext("experimental-webgl");
	glContext.clearColor(clearColor[0], clearColor[1], clearColor[2], clearColor[3]);
	glContext.clear(glContext.COLOR_BUFFER_BIT);
	}

	function init()
	{
	drawCanvas("topGL", [0, 0.5, 0, 1]);
	drawCanvas("bottomGL", [1, 0, 0, 1]);
	}
	</script>
	</head>

	<body onload="init()">
	<!-- Tests CSS visibility flag for WebGL layers. -->
	<!-- Pixel test only. Only the green webGL canvas should be visible. The red one should be hidden. -->
	<div><canvas id="topGL" class="visible" width="150" height="150"></canvas></div>
	<div><canvas id="bottomGL" class="hidden" width="150" height="150"></canvas></div>
	</body>
	</html>