third_party/WebKit/LayoutTests/compositing/webgl/webgl-repaint.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <style type="text/css" media="screen">
   5 canvas {
   6     margin: 20px;
   7     width: 200px;
   8     height: 200px;
   9     padding: 0 0;
  10 }
  11 .border {
  12     border: 1px solid black;
  13 }
  14 </style>
  15 <script src="../../resources/run-after-layout-and-paint.js"></script>
  16 <script>
  17 if (window.testRunner)
  18     testRunner.overridePreference("WebKitWebGLEnabled", "1");
  19
  20 function initWebGL()
  21 {
  22     var canvas = document.getElementById('canvas');
  23     var gl = canvas.getContext("webgl", {'antialias': false});
  24     if (!gl) {
  25         alert("No WebGL context found");
  26         return null;
  27     }
  28
  29     return gl;
  30 }
  31
  32 var gl = null;
  33
  34 function init()
  35 {
  36   gl = initWebGL();
  37   gl.viewport(0, 0, 200, 200);
  38   gl.clearColor(1, 0, 0, 1); // red
  39   gl.clear(gl.COLOR_BUFFER_BIT);
  40   if (window.testRunner) {
  41       testRunner.waitUntilDone();
  42       testRunner.dumpAsTextWithPixelResults();
  43   }
  44   runAfterLayoutAndPaint(drawGreen);
  45 }
  46
  47 function drawGreen()
  48 {
  49   gl.clearColor(0, 1, 0, 1); // green
  50   gl.clear(gl.COLOR_BUFFER_BIT);
  51   if (window.testRunner) {
  52       testRunner.notifyDone();
  53   } else
  54       window.setInterval(function() {
  55         document.getElementById('canvas').classList.toggle('border');
  56       }, 50);
  57 }
  58
  59 </script>
  60 </head>
  61 <body onload="init()">
  62 <canvas id="canvas" width="200" height="200"></canvas>
  63 </body>
  64 </html>