content/test/data/gpu/pixel_scissor.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4 <title>WebGL Scissor with context of preserveDrawingBuffer=true</title>
   5 <style type="text/css">
   6 .nomargin {
   7   margin: 0px auto;
   8 }
   9 </style>
  10
  11 <script>
  12
  13 function run() {
  14   var canvas = document.getElementById("c");
  15   gl = initGL(canvas);
  16   if (!gl) {
  17     domAutomationController.setAutomationId(1);
  18     domAutomationController.send("FAILURE");
  19     return;
  20   }
  21   gl.clearColor(1, 0, 0, 1);
  22   gl.clear(gl.COLOR_BUFFER_BIT);
  23   window.requestAnimationFrame(scissorAndClear);
  24 }
  25
  26 function initGL(canvas) {
  27   var gl = null;
  28   try {
  29     gl = canvas.getContext(
  30         "webgl", {preserveDrawingBuffer: true, alpha: false});
  31   } catch (e) {}
  32   return gl;
  33 }
  34
  35 function scissorAndClear() {
  36   gl.scissor(0, 0, 10, 10);
  37   gl.enable(gl.SCISSOR_TEST);
  38   gl.clearColor(0, 1, 0, 1);
  39   gl.clear(gl.COLOR_BUFFER_BIT);
  40
  41   domAutomationController.setAutomationId(1);
  42   domAutomationController.send("SUCCESS");
  43 }
  44 </script>
  45 </head>
  46 <body onload="run()">
  47 <div style="position:absolute; top:0px; left:0px">
  48 <canvas id="c" width="200" height="200" class="nomargin"></canvas>
  49 </div>
  50 </body>
  51 </html>