texture-formats-test.html (7838B)
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 Texture Format Conformance Tests</title> 12 <link rel="stylesheet" href="../../../resources/js-test-style.css"/> 13 <script src="../../../js/desktop-gl-constants.js"></script> 14 <script src="../../../js/js-test-pre.js"></script> 15 <script src="../../../js/webgl-test-utils.js"></script> 16 </head> 17 <body> 18 <div id="description"></div> 19 <div id="console"></div> 20 <canvas id="canvas2d" width="2" height="2" style="width: 50px; height: 50px; border: 1px solid black;"></canvas> 21 <canvas id="canvas" width="2" height="2" style="width: 100px; height:100px; border: 1px solid black;"></canvas> 22 <script> 23 "use strict"; 24 description("This test ensures WebGL implementations allow the OpenGL ES 2.0 texture formats and do not allow DesktopGL texture formats."); 25 26 debug(""); 27 debug("Canvas.getContext"); 28 29 var wtu = WebGLTestUtils; 30 var gl = wtu.create3DContext("canvas"); 31 if (!gl) { 32 testFailed("context does not exist"); 33 } else { 34 testPassed("context exists"); 35 36 debug(""); 37 debug("Checking texture formats."); 38 39 var createTexture = function(internalFormat, format, opt_border) { 40 var border = (opt_border === undefined) ? 0 : opt_border; 41 var tex = gl.createTexture(); 42 gl.bindTexture(gl.TEXTURE_2D, tex); 43 gl.texImage2D(gl.TEXTURE_2D, 44 0, // level 45 internalFormat, // internalFormat 46 16, // width 47 16, // height 48 border, // border 49 format, // format 50 gl.UNSIGNED_BYTE, // type 51 null); // data 52 } 53 54 var testValidFormat = function(internalFormat, formatName) { 55 createTexture(internalFormat, internalFormat); 56 wtu.glErrorShouldBe(gl, gl.NO_ERROR, 57 "was able to create texture of " + formatName); 58 } 59 60 var testInvalidFormat = function(internalFormat, formatName) { 61 createTexture(internalFormat, internalFormat); 62 var err = gl.getError(); 63 if (err == gl.NO_ERROR) { 64 testFailed("should NOT be able to create texture of type " + formatName); 65 } else if (err == gl.INVALID_ENUM || err == gl.INVALID_VALUE) { 66 testPassed("not able to create invalid format: " + formatName); 67 } 68 } 69 70 var invalidEnums = [ 71 '1', 72 '2', 73 '3', 74 '4', 75 'RGB4', 76 'RGB5', 77 'RGB8', 78 'RGB10', 79 'RGB12', 80 'RGB16', 81 'RGBA2', 82 'RGBA4', 83 'RGB5_A1', 84 'RGBA8', 85 'RGB10_A2', 86 'RGBA12', 87 'RGBA16', 88 'BGR', 89 'BGRA', 90 'ALPHA4_EXT', 91 'ALPHA8_EXT', 92 'ALPHA12_EXT', 93 'ALPHA16_EXT', 94 'COMPRESSED_ALPHA', 95 'COMPRESSED_LUMINANCE', 96 'COMPRESSED_LUMINANCE_ALPHA', 97 'COMPRESSED_INTENSITY', 98 'COMPRESSED_RGB', 99 'COMPRESSED_RGBA', 100 'DEPTH_COMPONENT16', 101 'DEPTH_COMPONENT24', 102 'DEPTH_COMPONENT32', 103 'LUMINANCE4_EXT', 104 'LUMINANCE8_EXT', 105 'LUMINANCE12_EXT', 106 'LUMINANCE16_EXT', 107 'LUMINANCE4_ALPHA4_EXT', 108 'LUMINANCE6_ALPHA2_EXT', 109 'LUMINANCE8_ALPHA8_EXT', 110 'LUMINANCE12_ALPHA4_EXT', 111 'LUMINANCE12_ALPHA12_EXT', 112 'LUMINANCE16_ALPHA16_EXT', 113 'INTENSITY_EXT', 114 'INTENSITY4_EXT', 115 'INTENSITY8_EXT', 116 'INTENSITY12_EXT', 117 'INTENSITY16_EXT', 118 'RGB4_EXT', 119 'RGB5_EXT', 120 'RGB8_EXT', 121 'RGB10_EXT', 122 'RGB12_EXT', 123 'RGB16_EXT', 124 'RGBA2_EXT', 125 'RGBA4_EXT', 126 'RGB5_A1_EXT', 127 'RGBA8_EXT', 128 'RGB10_A2_EXT', 129 'RGBA12_EXT', 130 'RGBA16_EXT', 131 'SLUMINANCE_EXT', 132 'SLUMINANCE8_EXT', 133 'SLUMINANCE_ALPHA_EXT', 134 'SLUMINANCE8_ALPHA8_EXT', 135 'SRGB_EXT', 136 'SRGB8_EXT', 137 'SRGB_ALPHA_EXT', 138 'SRGB8_ALPHA8' 139 ]; 140 141 for (var ii = 0; ii < invalidEnums.length; ++ii) { 142 var formatName = invalidEnums[ii] 143 if (desktopGL[formatName] === undefined) { 144 debug("bad format" + formatName) 145 } else { 146 testInvalidFormat(desktopGL[formatName], "GL_" + formatName); 147 } 148 } 149 150 var validEnums = [ 151 'ALPHA', 152 'RGB', 153 'RGBA', 154 'LUMINANCE', 155 'LUMINANCE_ALPHA' 156 ]; 157 158 for (var ii = 0; ii < validEnums.length; ++ii) { 159 var formatName = validEnums[ii] 160 testValidFormat(gl[formatName], "gl." + formatName); 161 } 162 163 debug(""); 164 debug("checking non 0 border parameter to gl.TexImage2D"); 165 createTexture(gl['RGBA'], gl['RGBA'], 1); 166 wtu.glErrorShouldBe(gl, gl.INVALID_VALUE, 167 "non 0 border to gl.TexImage2D should return INVALID_VALUE"); 168 169 170 var checkTypes = function() { 171 var tex = gl.createTexture(); 172 gl.bindTexture(gl.TEXTURE_2D, tex); 173 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 174 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 175 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 176 177 var loc = gl.getUniformLocation(program, "tex"); 178 gl.uniform1i(loc, 0); 179 180 var checkType = function(r, g, b, a, type, format, buf) { 181 var typeName = wtu.glEnumToString(gl, type); 182 var formatName = wtu.glEnumToString(gl, format); 183 var desc = "format: " + formatName + ", type: " + typeName; 184 debug(""); 185 debug("checking gl.texImage2D with " + desc + " and buffer type " + 186 buf.constructor.name); 187 gl.texImage2D(gl.TEXTURE_2D, 188 0, // level 189 format, // internalFormat 190 2, // width 191 2, // height 192 0, // border 193 format, // format 194 type, // type 195 buf); // data 196 197 wtu.glErrorShouldBe(gl, gl.NO_ERROR, 198 "gl.texImage2D with " + desc + " should generate NO_ERROR"); 199 200 wtu.clearAndDrawUnitQuad(gl, [255, 0, 0, 255]); 201 wtu.checkCanvas(gl, [r,g,b,a], 202 "texture " + desc + " should draw with " + 203 r + ", " + g + ", " + b + ", " + a); 204 205 } 206 checkType( 207 0, 255, 0, 255, gl.UNSIGNED_BYTE, gl.RGBA, 208 new Uint8Array( 209 [ 0, 255, 0, 255, 210 0, 255, 0, 255, 211 0, 255, 0, 255, 212 0, 255, 0, 255])); 213 checkType( 214 0, 255, 0, 255, gl.UNSIGNED_BYTE, gl.RGBA, 215 new Uint8ClampedArray( 216 [ 0, 255, 0, 255, 217 0, 255, 0, 255, 218 0, 255, 0, 255, 219 0, 255, 0, 255])); 220 checkType( 221 0, 0, 255, 255, gl.UNSIGNED_SHORT_4_4_4_4, gl.RGBA, 222 new Uint16Array( 223 [ 255, 255, 224 255, 255, 225 255, 255, 226 255, 255])); 227 checkType( 228 0, 255, 0, 255, gl.UNSIGNED_SHORT_5_6_5, gl.RGB, 229 new Uint16Array( 230 [ 2016, 2016, 231 2016, 2016, 232 2016, 2016, 233 2016, 2016])); 234 checkType( 235 0, 0, 255, 255, gl.UNSIGNED_SHORT_5_5_5_1, gl.RGBA, 236 new Uint16Array( 237 [ 63, 63, 238 63, 63, 239 63, 63, 240 63, 63])); 241 checkType( 242 255, 255, 255, 255, gl.UNSIGNED_BYTE, gl.LUMINANCE, 243 new Uint8Array([ 244 255, 245 255, 246 255, 247 255])); 248 checkType( 249 0, 0, 0, 128, gl.UNSIGNED_BYTE, gl.ALPHA, 250 new Uint8Array([ 251 128, 252 128, 253 128, 254 128])); 255 checkType( 256 128, 128, 128, 192, gl.UNSIGNED_BYTE, gl.LUMINANCE_ALPHA, 257 new Uint8Array([ 258 128, 192, 259 128, 192, 260 128, 192, 261 128, 192])); 262 } 263 var program = wtu.setupTexturedQuad(gl); 264 gl.pixelStorei(gl.UNPACK_ALIGNMENT, 1); 265 checkTypes(); 266 } 267 268 debug(""); 269 var successfullyParsed = true; 270 </script> 271 <script src="../../../js/js-test-post.js"></script> 272 273 </body> 274 </html>