dom/canvas/test/webgl-conf/checkout/conformance2/textures/misc/texture-npot.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>WebGL2 Non-Power of 2 texture 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="example" width="5" height="3" style="width: 40px; height: 30px;"></canvas>
  18 <div id="description"></div>
  19 <div id="console"></div>
  20 <script id="vshader" type="x-shader/x-vertex">
  21 attribute vec4 vPosition;
  22 attribute vec2 texCoord0;
  23 varying vec2 texCoord;
  24 void main()
  25 {
  26     gl_Position = vPosition;
  27     texCoord = texCoord0;
  28 }
  29 </script>
  30
  31 <script id="fshader" type="x-shader/x-fragment">
  32 precision mediump float;
  33 uniform samplerCube tex;
  34 varying vec2 texCoord;
  35 void main()
  36 {
  37     gl_FragColor = textureCube(tex, normalize(vec3(texCoord, 1)));
  38 }
  39 </script>
  40 <script>
  41 "use strict";
  42 description(document.title);
  43 var wtu = WebGLTestUtils;
  44 var gl = wtu.create3DContext("example", undefined, 2);
  45 var program = wtu.setupTexturedQuad(gl);
  46
  47 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
  48
  49 var tests = [
  50   { format: gl.RGBA,
  51     type: gl.UNSIGNED_BYTE,
  52     color: [192, 0, 128, 64],
  53     expected: [192, 0, 128, 64],
  54     tolerance: 0,
  55   },
  56   { format: gl.RGB,
  57     type: gl.UNSIGNED_BYTE,
  58     color: [192, 0, 128],
  59     expected: [192, 0, 128, 255],
  60     tolerance: 0,
  61   },
  62   { format: gl.LUMINANCE,
  63     type: gl.UNSIGNED_BYTE,
  64     color: [192],
  65     expected: [192, 192, 192, 255],
  66     tolerance: 0,
  67   },
  68   { format: gl.ALPHA,
  69     type: gl.UNSIGNED_BYTE,
  70     color: [64],
  71     expected: [0, 0, 0, 64],
  72     tolerance: 0,
  73   },
  74   { format: gl.LUMINANCE_ALPHA,
  75     type: gl.UNSIGNED_BYTE,
  76     color: [192, 64],
  77     expected: [192, 192, 192, 64],
  78     tolerance: 0,
  79   },
  80 ];
  81
  82 tests.forEach(function(test) {
  83   debug("");
  84   debug("test " + wtu.glEnumToString(gl, test.format) + "/" + wtu.glEnumToString(gl, test.type));
  85   var tex = gl.createTexture();
  86
  87   // Check that an NPOT texture not on level 0 does not generate INVALID_VALUE
  88   wtu.fillTexture(gl, tex, 5, 3, test.color, 1, test.format, test.type);
  89   wtu.glErrorShouldBe(gl, gl.NO_ERROR,
  90       "gl.texImage2D with NPOT texture with level > 0 should succeed");
  91
  92   // Check that an NPOT texture on level 0 succeeds
  93   wtu.fillTexture(gl, tex, 5, 3, test.color, 0, test.format, test.type);
  94   wtu.glErrorShouldBe(gl, gl.NO_ERROR,
  95       "gl.texImage2D with NPOT texture at level 0 should succeed");
  96
  97   // Check that generateMipmap succeeds on NPOT
  98   gl.generateMipmap(gl.TEXTURE_2D);
  99   wtu.glErrorShouldBe(gl, gl.NO_ERROR,
 100       "gl.generateMipmap with NPOT texture should succeed");
 101
 102   // Check that nothing is drawn if filtering is not correct for NPOT
 103   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
 104   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
 105   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
 106   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
 107
 108   wtu.clearAndDrawUnitQuad(gl);
 109   wtu.checkCanvas(
 110       gl, test.expected,
 111       "NPOT texture with TEXTURE_WRAP set to REPEAT should draw");
 112   wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
 113
 114   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
 115   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
 116   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST_MIPMAP_LINEAR);
 117
 118   wtu.clearAndDrawUnitQuad(gl);
 119   wtu.checkCanvas(
 120       gl, test.expected,
 121       "NPOT texture with TEXTURE_MIN_FILTER not NEAREST or LINEAR should draw");
 122   wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
 123
 124   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
 125
 126   wtu.clearAndDrawUnitQuad(gl);
 127   wtu.checkCanvas(
 128       gl, test.expected,
 129       "NPOT texture with TEXTURE_MIN_FILTER set to LINEAR should draw.");
 130
 131   gl.copyTexImage2D(gl.TEXTURE_2D, 1, test.format, 0, 0, 5, 3, 0);
 132   wtu.glErrorShouldBe(gl, gl.NO_ERROR,
 133       "copyTexImage2D with NPOT texture with level > 0 should succeed.");
 134
 135   // Check that generateMipmap for an POT texture succeeds
 136   wtu.fillTexture(gl, tex, 2, 2, test.color, 0, test.format);
 137   gl.generateMipmap(gl.TEXTURE_2D);
 138   wtu.glErrorShouldBe(gl, gl.NO_ERROR,
 139       "gl.texImage2D and gl.generateMipmap with POT texture at level 0 should succeed");
 140
 141   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
 142   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
 143   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
 144   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
 145
 146   wtu.clearAndDrawUnitQuad(gl);
 147   wtu.checkCanvas(
 148       gl, test.expected,
 149       "POT texture with TEXTURE_MIN_FILTER set to LINEAR_MIPMAP_LINEAR should draw.");
 150   wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
 151 });
 152
 153 var successfullyParsed = true;
 154
 155 </script>
 156 <script src="../../../js/js-test-post.js"></script>
 157
 158 </body>
 159 </html>
 160