third_party/WebKit/LayoutTests/fast/canvas/webgl/texture-npot.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   2   "http://www.w3.org/TR/html4/loose.dtd">
   3 <html>
   4 <head>
   5 <title>WebGL Non-Power of 2 texture conformance test.</title>
   6 <script src="../../../resources/js-test.js"></script>
   7 <script src="resources/webgl-test.js"> </script>
   8 <script src="resources/webgl-test-utils.js"> </script>
   9 </head>
  10 <body>
  11 <canvas id="example" width="4" height="4" style="width: 40px; height: 30px;"></canvas>
  12 <div id="description"></div>
  13 <div id="console"></div>
  14 <script id="vshader" type="x-shader/x-vertex">
  15 attribute vec4 vPosition;
  16 attribute vec2 texCoord0;
  17 varying vec2 texCoord;
  18 void main()
  19 {
  20     gl_Position = vPosition;
  21     texCoord = texCoord0;
  22 }
  23 </script>
  24
  25 <script id="fshader" type="x-shader/x-fragment">
  26 #ifdef GL_ES
  27 precision mediump float;
  28 #endif
  29 uniform samplerCube tex;
  30 varying vec2 texCoord;
  31 void main()
  32 {
  33     gl_FragColor = textureCube(tex, normalize(vec3(texCoord, 1)));
  34 }
  35 </script>
  36 <script>
  37 if (window.internals)
  38     window.internals.settings.setWebGLErrorsToConsoleEnabled(false);
  39
  40 var wtu = WebGLTestUtils;
  41 var canvas = document.getElementById("example");
  42 var gl = wtu.create3DContext(canvas);
  43 var program = wtu.setupTexturedQuad(gl);
  44
  45 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
  46
  47 var tex = gl.createTexture();
  48
  49 // Check that an NPOT texture not on level 0 generates INVALID_VALUE
  50 wtu.fillTexture(gl, tex, 5, 3, [0, 192, 128, 255], 1);
  51 glErrorShouldBe(gl, gl.INVALID_VALUE,
  52     "gl.texImage2D with NPOT texture with level > 0 should return INVALID_VALUE");
  53
  54 // Check that an NPOT texture on level 0 succeeds
  55 wtu.fillTexture(gl, tex, 5, 3, [0, 192, 128, 255]);
  56 glErrorShouldBe(gl, gl.NO_ERROR,
  57     "gl.texImage2D with NPOT texture at level 0 should succeed");
  58
  59 // Check that generateMipmap fails on NPOT
  60 gl.generateMipmap(gl.TEXTURE_2D);
  61 glErrorShouldBe(gl, gl.INVALID_OPERATION,
  62     "gl.generateMipmap with NPOT texture should return INVALID_OPERATION");
  63
  64 var loc = gl.getUniformLocation(program, "tex");
  65 gl.uniform1i(loc, 0);
  66
  67 // Check that nothing is drawn if filtering is not correct for NPOT
  68 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
  69 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
  70 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
  71 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
  72
  73 wtu.drawQuad(gl);
  74 wtu.checkCanvas(
  75     gl, [0, 0, 0, 255],
  76     "NPOT texture with TEXTURE_WRAP set to REPEAT should draw with 0,0,0,255");
  77 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
  78
  79 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  80 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  81 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST_MIPMAP_LINEAR);
  82
  83 wtu.drawQuad(gl);
  84 wtu.checkCanvas(
  85     gl, [0, 0, 0, 255],
  86     "NPOT texture with TEXTURE_MIN_FILTER not NEAREST or LINEAR should draw with 0,0,0,255");
  87 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
  88
  89 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
  90
  91 wtu.drawQuad(gl);
  92 wtu.checkCanvas(
  93     gl, [0, 192, 128, 255],
  94     "NPOT texture with TEXTURE_MIN_FILTER set to LINEAR should draw.");
  95
  96 gl.copyTexImage2D(gl.TEXTURE_2D, 1, gl.RGBA, 0, 0, 5, 3, 0);
  97 glErrorShouldBe(gl, gl.INVALID_VALUE,
  98     "copyTexImage2D with NPOT texture with level > 0 should return INVALID_VALUE.");
  99
 100 // Check that generateMipmap for an POT texture succeeds
 101 wtu.fillTexture(gl, tex, 4, 4, [0, 192, 128, 255]);
 102 gl.generateMipmap(gl.TEXTURE_2D);
 103 glErrorShouldBe(gl, gl.NO_ERROR,
 104     "gl.texImage2D and gl.generateMipmap with POT texture at level 0 should succeed");
 105
 106 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
 107 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
 108 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
 109 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
 110
 111 wtu.drawQuad(gl);
 112 wtu.checkCanvas(
 113     gl, [0, 192, 128, 255],
 114     "POT texture with TEXTURE_MIN_FILTER set to LINEAR_MIPMAP_LINEAR should draw.");
 115 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
 116
 117 debug("");
 118 debug("check using cubemap");
 119 var program = wtu.setupProgram(
 120     gl,
 121     [wtu.loadShaderFromScript(gl, 'vshader', gl.VERTEX_SHADER),
 122      wtu.loadShaderFromScript(gl, 'fshader', gl.FRAGMENT_SHADER)],
 123     ['vPosition', 'texCoord0'], [0, 1]);
 124 var tex = gl.createTexture();
 125
 126 // Check that an NPOT texture not on level 0 generates INVALID_VALUE
 127 fillCubeTexture(gl, tex, 5, 3, [0, 192, 128, 255], 1);
 128 glErrorShouldBe(gl, gl.INVALID_VALUE,
 129     "gl.texImage2D with NPOT texture with level > 0 should return INVALID_VALUE");
 130
 131 // Check that an NPOT texture on level 0 succeeds
 132 fillCubeTexture(gl, tex, 5, 5, [0, 192, 128, 255]);
 133 glErrorShouldBe(gl, gl.NO_ERROR,
 134     "gl.texImage2D with NPOT texture at level 0 should succeed");
 135
 136 // Check that generateMipmap fails on NPOT
 137 gl.generateMipmap(gl.TEXTURE_CUBE_MAP);
 138 glErrorShouldBe(gl, gl.INVALID_OPERATION,
 139     "gl.generateMipmap with NPOT texture should return INVALID_OPERATION");
 140
 141 var loc = gl.getUniformLocation(program, "tex");
 142 gl.uniform1i(loc, 0);
 143
 144 // Check that nothing is drawn if filtering is not correct for NPOT
 145 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
 146 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
 147 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_S, gl.REPEAT);
 148 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_T, gl.REPEAT);
 149
 150 wtu.drawQuad(gl);
 151 wtu.checkCanvas(
 152     gl, [0, 0, 0, 255],
 153     "NPOT cubemap with TEXTURE_WRAP set to REPEAT should draw with 0,0,0,255");
 154 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
 155
 156 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
 157 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
 158 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER, gl.NEAREST_MIPMAP_LINEAR);
 159
 160 wtu.drawQuad(gl);
 161 wtu.checkCanvas(
 162     gl, [0, 0, 0, 255],
 163     "NPOT cubemap with TEXTURE_MIN_FILTER not NEAREST or LINEAR should draw with 0,0,0,255");
 164 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
 165
 166 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
 167
 168 wtu.drawQuad(gl);
 169 wtu.checkCanvas(
 170     gl, [0, 192, 128, 255],
 171     "NPOT cubemap with TEXTURE_MIN_FILTER set to LINEAR should draw.");
 172
 173 // Check that an POT texture on level 0 succeeds
 174 fillCubeTexture(gl, tex, 4, 4, [0, 192, 128, 255]);
 175 glErrorShouldBe(gl, gl.NO_ERROR,
 176     "gl.texImage2D with POT texture at level 0 should succeed");
 177
 178 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_LINEAR);
 179 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
 180 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_S, gl.REPEAT);
 181 gl.texParameteri(gl.TEXTURE_CUBE_MAP, gl.TEXTURE_WRAP_T, gl.REPEAT);
 182
 183 wtu.drawQuad(gl);
 184 wtu.checkCanvas(
 185     gl, [0, 0, 0, 255],
 186     "POT cubemap with TEXTURE_MIN_FILTER set to LINEAR_MIPMAP_LINEAR but no mips draw with 0,0,0,255");
 187
 188 // Check that generateMipmap succeeds on POT
 189 gl.generateMipmap(gl.TEXTURE_CUBE_MAP);
 190 glErrorShouldBe(gl, gl.NO_ERROR,
 191     "gl.generateMipmap with POT texture should return succeed");
 192
 193 wtu.drawQuad(gl);
 194 wtu.checkCanvas(
 195     gl, [0, 192, 128, 255],
 196     "POT cubemap with TEXTURE_MIN_FILTER set to LINEAR_MIPMAP_LINEAR should draw.");
 197
 198 function fillCubeTexture(gl, tex, width, height, color, opt_level) {
 199   opt_level = opt_level || 0;
 200   var canvas = document.createElement('canvas');
 201   canvas.width = width;
 202   canvas.height = height;
 203   var ctx2d = canvas.getContext('2d');
 204   ctx2d.fillStyle = "rgba(" + color[0] + "," + color[1] + "," + color[2] + "," + color[3] + ")";
 205   ctx2d.fillRect(0, 0, width, height);
 206   gl.bindTexture(gl.TEXTURE_CUBE_MAP, tex);
 207   var targets = [
 208     gl.TEXTURE_CUBE_MAP_POSITIVE_X,
 209     gl.TEXTURE_CUBE_MAP_NEGATIVE_X,
 210     gl.TEXTURE_CUBE_MAP_POSITIVE_Y,
 211     gl.TEXTURE_CUBE_MAP_NEGATIVE_Y,
 212     gl.TEXTURE_CUBE_MAP_POSITIVE_Z,
 213     gl.TEXTURE_CUBE_MAP_NEGATIVE_Z];
 214   for (var tt = 0; tt < targets.length; ++tt) {
 215     gl.texImage2D(
 216         targets[tt], opt_level, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas);
 217   }
 218 };
 219
 220 </script>
 221 </body>
 222
 223 <script>
 224 </script>
 225
 226 </body>
 227 </html>
 228