dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texparameter-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 TexParameter conformance 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 </head>
  16 <body>
  17 <canvas id="canvas_drawing" width="12" height="12"></canvas>
  18 <canvas id="canvas_texture" width="2" height="2"></canvas>
  19 <div id="description"></div>
  20 <div id="console"></div>
  21 <script>
  22 "use strict";
  23 description("Tests TexParameter works as expected");
  24 debug("");
  25
  26 var wtu = WebGLTestUtils;
  27 var gl = wtu.create3DContext("canvas_drawing");
  28 var canvas_texture = null;
  29 var texParam = [
  30     gl.REPEAT,
  31     gl.CLAMP_TO_EDGE,
  32     gl.MIRRORED_REPEAT,
  33 ];
  34 var color = [200, 0, 254, 255];
  35 var textures = [];
  36
  37 if (!gl) {
  38     testFailed("WebGL context does not exist");
  39 } else {
  40     testPassed("WebGL context exists");
  41
  42     wtu.setupTexturedQuadWithTexCoords(gl, [-2.5, -2.5], [3.5, 3.5]);
  43
  44     setupCanvasTexture();
  45     setupTextures();
  46     for (var ii = 0; ii < texParam.length; ++ii) {
  47         runDrawingTest(textures[ii], texParam[ii]);
  48     }
  49
  50     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors");
  51 }
  52
  53 function setupCanvasTexture() {
  54     canvas_texture = document.getElementById("canvas_texture");
  55     var ctx2d = canvas_texture.getContext("2d");
  56     ctx2d.fillStyle = "rgba(" + color[0] + "," + color[1] + "," + color[2] + "," + color[3] + ")";
  57     ctx2d.fillRect(0, 0, 1, 1);
  58 }
  59
  60 function setupTextures() {
  61     for (var ii = 0; ii < texParam.length; ++ii) {
  62         var texture = gl.createTexture();
  63         gl.bindTexture(gl.TEXTURE_2D, texture);
  64         gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas_texture);
  65         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
  66         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
  67         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, texParam[ii]);
  68         gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, texParam[ii]);
  69         textures[ii] = texture;
  70     }
  71 }
  72
  73 function runDrawingTest(texture, param) {
  74     gl.clearColor(1, 1, 1, 1);
  75     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  76
  77     gl.bindTexture(gl.TEXTURE_2D, texture);
  78     gl.drawArrays(gl.TRIANGLES, 0, 6);
  79
  80     checkPixels(param);
  81 }
  82
  83 function checkPixels(param) {
  84     var buf = new Uint8Array(12 * 12 * 4);
  85     gl.readPixels(0, 0, 12, 12, gl.RGBA, gl.UNSIGNED_BYTE, buf);
  86     var passed = true;
  87     for (var yy = 0; yy < 12; ++yy) {
  88         for (var xx = 0; xx < 12; ++xx) {
  89             var ec = [0, 0, 0, 0];
  90             switch (param) {
  91                 case gl.REPEAT:
  92                     if (xx % 2 == 1 && yy % 2 == 1) {
  93                         ec = color;
  94                     }
  95                     break;
  96                 case gl.CLAMP_TO_EDGE:
  97                     if (xx < 6 && yy < 6) {
  98                         ec = color;
  99                     }
 100                     break;
 101                 case gl.MIRRORED_REPEAT:
 102                     if (xx % 4 < 2 && yy % 4 < 2) {
 103                         ec = color;
 104                     }
 105                     break;
 106             }
 107             var off = (yy * 12 + xx) * 4;
 108             if (buf[off + 0] != ec[0] || buf[off + 1] != ec[1] ||
 109                 buf[off + 2] != ec[2] || buf[off + 3] != ec[3]) {
 110                 var msg = 'at (' + xx + ', ' + yy + ') expected: ' +
 111                     ec[0] + ', ' + ec[1] + ', ' + ec[2] + ', ' + ec[3] + ' found: ' +
 112                     buf[off + 0] + ', ' + buf[off + 1] + ', ' + buf[off + 2] + ', ' + buf[off + 3];
 113                 testFailed(msg);
 114                 passed = false;
 115             }
 116         }
 117     }
 118     if (passed) {
 119         testPassed("Drawing with wrap " + wtu.glEnumToString(gl, param) + " as expected");
 120     }
 121 }
 122
 123 var successfullyParsed = true;
 124 </script>
 125 <script src="../../../js/js-test-post.js"></script>
 126
 127 </body>
 128 </html>
 129