third_party/WebKit/LayoutTests/compositing/visibility/visibility-simple-webgl-layer.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <style>
   5       canvas {
   6           background-color: rgba(0, 0, 0, 1);
   7       }
   8
   9       .hidden {
  10           visibility: hidden;
  11       }
  12
  13       .visible {
  14           visibility: visible;
  15       }
  16     </style>
  17
  18     <script>
  19       if (window.testRunner) {
  20           testRunner.dumpAsTextWithPixelResults();
  21           testRunner.overridePreference("WebKitWebGLEnabled", "1");
  22       }
  23
  24       function drawCanvas(canvasID, clearColor)
  25       {
  26           var theCanvas = document.getElementById(canvasID);
  27           var glContext = theCanvas.getContext("webgl");
  28           glContext.clearColor(clearColor[0], clearColor[1], clearColor[2], clearColor[3]);
  29           glContext.clear(glContext.COLOR_BUFFER_BIT);
  30       }
  31
  32       function init()
  33       {
  34           drawCanvas("topGL", [0, 0.5, 0, 1]);
  35           drawCanvas("bottomGL", [1, 0, 0, 1]);
  36       }
  37     </script>
  38   </head>
  39
  40   <body onload="init()">
  41     <!-- Tests CSS visibility flag for WebGL layers. -->
  42     <!-- Pixel test only. Only the green webGL canvas should be visible. The red one should be hidden. -->
  43     <div><canvas id="topGL" class="visible" width="150" height="150"></canvas></div>
  44     <div><canvas id="bottomGL" class="hidden" width="150" height="150"></canvas></div>
  45   </body>
  46 </html>