dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/copy-tex-image-and-sub-image-2d.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 <link rel="stylesheet" href="../../../resources/js-test-style.css"/>
  12 <script src="../../../js/js-test-pre.js"></script>
  13 <script src="../../../js/webgl-test-utils.js"></script>
  14
  15 <script>
  16 "use strict";
  17 var successfullyParsed = false;
  18
  19 function init()
  20 {
  21     description('Verify copyTexImage2D and copyTexSubImage2D');
  22
  23     runTest();
  24 }
  25
  26 var gl = null;
  27 var wtu = WebGLTestUtils;
  28
  29 function runTestIteration(antialias)
  30 {
  31     var canvas = document.getElementById(
  32         antialias ? "antialiasOn" : "antialiasOff");
  33     var attribs = antialias ? { antialias: true } : { antialias: false };
  34     gl = wtu.create3DContext(canvas, attribs);
  35     var program = wtu.setupTexturedQuad(gl);
  36     var textureLoc = gl.getUniformLocation(program, "tex");
  37     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "During Initialization");
  38
  39     gl.colorMask(1, 1, 1, 1);
  40     gl.disable(gl.BLEND);
  41     debug('Testing copyTexImage2D');
  42
  43     // Red canvas
  44     gl.clearColor(1, 0, 0, 1);
  45     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  46
  47     var texture = gl.createTexture();
  48     // Bind the texture to texture unit 0
  49     gl.bindTexture(gl.TEXTURE_2D, texture);
  50     // Set up texture
  51     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 2, 2, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  52     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
  53     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
  54     gl.uniform1i(textureLoc, 0);
  55
  56     var colors = [
  57       [1, 0, 0, 1],
  58       [0, 1, 0, 1],
  59       [0, 0, 1, 1],
  60       [0.5, 0.5, 0.5, 0.5],
  61     ];
  62     var data = new Uint8Array(2 * 2 * 4);
  63     for (var ii = 0; ii < 2 * 2 * 4; ++ii)
  64       data[ii] = 136; // A random number other than 0.
  65     var count = 0;
  66     for (var yy = -2; yy <= 2; ++yy) {
  67       for (var xx = -2; xx <= 2; ++xx) {
  68         for (var ii = 0; ii < 2; ++ii) {
  69           var texColor = colors[count];
  70           var clearColor = colors[(count + 1) % colors.length];
  71           // clear to some color
  72           gl.clearColor(texColor[0], texColor[1], texColor[2], texColor[3]);
  73           gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  74
  75           // copy that color to the texture.
  76           switch (ii) {
  77           case 0:
  78             gl.copyTexImage2D(gl.TEXTURE_2D, 0, gl.RGBA, xx, yy, 2, 2, 0);
  79             wtu.glErrorShouldBe(gl, gl.NO_ERROR,
  80                 "using copyTexImage2D: x = " + xx + ", y = " + yy);
  81             break;
  82           case 1:
  83             gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 2, 2, 0, gl.RGBA, gl.UNSIGNED_BYTE, data);
  84             gl.copyTexSubImage2D(gl.TEXTURE_2D, 0, 0, 0, xx, yy, 2, 2);
  85             wtu.glErrorShouldBe(gl, gl.NO_ERROR,
  86                 "using copyTexSubImage2D: x = " + xx + ", y = " + yy);
  87             break;
  88           }
  89
  90           // clear to some other color.
  91           gl.clearColor(clearColor[0], clearColor[1], clearColor[2], clearColor[3]);
  92           gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  93
  94           // Draw the triangles
  95           wtu.clearAndDrawUnitQuad(gl);
  96
  97           // check the rendering results
  98           for (var iy = 0; iy < 2; ++iy) {
  99             for (var ix = 0; ix < 2; ++ix) {
 100               var x = xx + ix;
 101               var y = yy + iy;
 102               var expectedColor = (x < 0 || y < 0 || x >= 2 || y >= 2) ?
 103                   (ii == 0 ? [0, 0, 0, 0] : [136, 136, 136, 136]) :
 104                   [Math.floor(255 * texColor[0]),
 105                    Math.floor(255 * texColor[1]),
 106                    Math.floor(255 * texColor[2]),
 107                    Math.floor(255 * texColor[3])];
 108               wtu.checkCanvasRect(gl, ix, iy, 1, 1, expectedColor,
 109                   "" + ix + ", " + iy + " should render " + expectedColor + " (+/-1)", 1);
 110             }
 111           }
 112           count = (count + 1) % colors.length;
 113         }
 114       }
 115     }
 116
 117     debug("");
 118 }
 119
 120 function runTest(antialias)
 121 {
 122     debug("Testing with antialias on");
 123     runTestIteration(true);
 124     debug("Testing with antialias off");
 125     runTestIteration(false);
 126
 127     finishTest();
 128 }
 129 </script>
 130 </head>
 131 <body onload="init()">
 132 <canvas id="antialiasOn" width="2" height="2"></canvas>
 133 <canvas id="antialiasOff" width="2" height="2"></canvas>
 134 <div id="description"></div>
 135 <div id="console"></div>
 136 </body>
 137 </html>