dom/canvas/test/webgl-conf/checkout/conformance/rendering/gl-scissor-test.html

   1 <!--
   2 Copyright (c) 2019 The Khronos Group Inc.
   3 Use of this source code is governed by an MIT-style license that can be
   4 found in the LICENSE.txt file.
   5 -->
   6
   7 <!DOCTYPE html>
   8 <html>
   9 <head>
  10 <meta charset="utf-8">
  11 <title>WebGL Scissor Test</title>
  12 <link rel="stylesheet" href="../../resources/js-test-style.css"/>
  13 <script src="../../js/js-test-pre.js"></script>
  14 <script src="../../js/webgl-test-utils.js"></script>
  15 <style>
  16 canvas {
  17     border: 1px solid #000;
  18     width: 64px;
  19     height: 64px;
  20 }
  21 </style>
  22 </head>
  23 <body>
  24 <canvas id="canvas1" width="16" height="16"> </canvas>
  25 <canvas id="canvas2" width="16" height="16"> </canvas>
  26 <div id="description"></div>
  27 <div id="console"></div>
  28 <script>
  29 "use strict";
  30 description("Check if glScissor setting works.");
  31
  32 var wtu = WebGLTestUtils;
  33
  34 function test(canvas, attribs) {
  35   var gl = wtu.create3DContext(canvas, attribs);
  36
  37   function test(func) {
  38     gl.disable(gl.SCISSOR_TEST);
  39     gl.clearColor(0,0,0,0);
  40     gl.clear(gl.COLOR_BUFFER_BIT);
  41     gl.enable(gl.SCISSOR_TEST);
  42
  43     var size = 16;
  44     for (var ii = 0; ii < size; ++ii) {
  45       // clear a portion of the WebGL drawing buffer
  46       gl.scissor(ii, ii, 1, 1);
  47       func();
  48     }
  49
  50     for (var ii = 0; ii < size; ++ii) {
  51       wtu.checkCanvasRect(gl, 0, ii, ii, 1, [0, 0, 0, 0], "should be black");
  52       wtu.checkCanvasRect(gl, ii, ii, 1, 1, [0, 255, 0, 255], "should be green");
  53       wtu.checkCanvasRect(gl, ii + 1, ii, size - ii - 1, 1, [0, 0, 0, 0], "should be black");
  54     }
  55   }
  56
  57   if (!gl) {
  58     testFailed("context does not exist");
  59   } else {
  60     testPassed("context exists");
  61
  62     debug("");
  63     debug("test with clear");
  64     test(function() {
  65       gl.clearColor(0, 1, 0, 1);
  66       gl.clear(gl.COLOR_BUFFER_BIT);
  67     });
  68
  69     wtu.setupColorQuad(gl);
  70
  71     debug("");
  72     debug("test with draw");
  73     test(function() {
  74       wtu.drawFloatColorQuad(gl, [0, 1, 0, 1]);
  75     });
  76
  77     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");
  78   }
  79 }
  80
  81 debug("test antialias: false");
  82 test(document.getElementById("canvas1"), {antialias: false});
  83
  84 debug("");
  85 debug("test antialias: true");
  86 test(document.getElementById("canvas2"), {antialias: true});
  87
  88 debug("");
  89 var successfullyParsed = true;
  90
  91 </script>
  92 <script src="../../js/js-test-post.js"></script>
  93
  94 </body>
  95 </html>