diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 19:33:14 +0000 |
commit | 36d22d82aa202bb199967e9512281e9a53db42c9 (patch) | |
tree | 105e8c98ddea1c1e4784a60a5a6410fa416be2de /dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-mips.html | |
parent | Initial commit. (diff) | |
download | firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip |
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-mips.html')
-rw-r--r-- | dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-mips.html | 297 |
1 files changed, 297 insertions, 0 deletions
diff --git a/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-mips.html b/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-mips.html new file mode 100644 index 0000000000..6f038b8475 --- /dev/null +++ b/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-mips.html @@ -0,0 +1,297 @@ +<!-- +Copyright (c) 2019 The Khronos Group Inc. +Use of this source code is governed by an MIT-style license that can be +found in the LICENSE.txt file. +--> + +<!DOCTYPE html> +<html> +<head> +<meta charset="utf-8"> +<title>WebGL texture mips conformance test.</title> +<link rel="stylesheet" href="../../../resources/js-test-style.css"/> +<script src="../../../js/js-test-pre.js"></script> +<script src="../../../js/webgl-test-utils.js"></script> +</head> +<body> +<canvas id="example" width="2" height="2" style="width: 40px; height: 40px;"></canvas> +<div id="description"></div> +<div id="console"></div> +<script id="vshader" type="x-shader/x-vertex"> +uniform vec4 uMult; +attribute vec4 vPosition; +attribute vec2 texCoord0; +varying vec2 texCoord; +void main() +{ + gl_Position = vPosition * uMult; + texCoord = texCoord0; +} +</script> + +<script id="fshader" type="x-shader/x-fragment"> +precision mediump float; +uniform sampler2D tex; +varying vec2 texCoord; +void main() +{ + gl_FragColor = texture2D(tex, texCoord); +} +</script> +<script> +"use strict"; +var canvas; +var wtu = WebGLTestUtils; +function init() +{ + description("Checks mip issues"); + + canvas = document.getElementById("example"); + shouldBe("canvas.width", "2"); + shouldBe("canvas.height", "2"); + + var gl = wtu.create3DContext(canvas); + + var tex = gl.createTexture(); + gl.bindTexture(gl.TEXTURE_2D, tex); + gl.generateMipmap(gl.TEXTURE_2D); + wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "for generateMipmap with mip 0 is 0x0"); + gl.texImage2D( + gl.TEXTURE_2D, 1, gl.RGBA, 1, 1, 0, gl.RGBA, gl.UNSIGNED_BYTE, + new Uint8Array(4)); + gl.generateMipmap(gl.TEXTURE_2D); + wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "for generateMipmap with mip 0 is 0x0"); + + tex = gl.createTexture(); + gl.bindTexture(gl.TEXTURE_CUBE_MAP, tex); + gl.generateMipmap(gl.TEXTURE_CUBE_MAP); + wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "for generateMipmap with mip 0 is 0x0"); + + var faces = [ + gl.TEXTURE_CUBE_MAP_POSITIVE_X, + gl.TEXTURE_CUBE_MAP_NEGATIVE_X, + gl.TEXTURE_CUBE_MAP_POSITIVE_Y, + gl.TEXTURE_CUBE_MAP_NEGATIVE_Y, + gl.TEXTURE_CUBE_MAP_POSITIVE_Z, + gl.TEXTURE_CUBE_MAP_NEGATIVE_Z + ]; + for (var ii = 0; ii < faces.length; ++ii) { + gl.texImage2D( + faces[ii], 0, gl.RGBA, 2, 2, 0, gl.RGBA, gl.UNSIGNED_BYTE, + new Uint8Array(4 * 2 * 2)); + gl.generateMipmap(gl.TEXTURE_CUBE_MAP); + wtu.glErrorShouldBe(gl, ii == 5 ? gl.NO_ERROR : gl.INVALID_OPERATION, "for generateMipmap with " + (ii + 1) + " faces"); + } + + wtu.setupUnitQuad(gl, 0, 1); + var program = wtu.setupProgram( + gl, ['vshader', 'fshader'], ['vPosition', 'texCoord0'], [0, 1]); + + gl.disable(gl.DEPTH_TEST); + gl.disable(gl.BLEND); + + var colors = { + blue: [0, 0, 255, 255], + red: [255, 0, 0, 255], + green: [0, 255, 0, 255], + cyan: [128, 255, 255, 255], + black: [0, 0, 0, 255], + blank: [0, 0, 0, 0] + }; + + var mips = [ + ]; + + var texLoc = gl.getUniformLocation(program, "tex"); + gl.uniform1i(texLoc, 0); + var multLoc = gl.getUniformLocation(program, "uMult"); + + // ---------------------------------------------------- + var clearTex = createTexture(); + gl.uniform4f(multLoc, 1, 1, 1, 1); + gl.bindTexture(gl.TEXTURE_2D, clearTex); + gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 16, 16, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); + debug('gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 16, 16, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);'); + setMipData(0, 16, 'blank'); + makeDivMipChain(); + generateMipmap(); + check('blank', "texture created with null that has all mips"); + + // ---------------------------------------------------- + var tex = createTexture(); + gl.uniform4f(multLoc, 1, 1, 1, 1); + + gl.bindTexture(gl.TEXTURE_2D, tex); + // 16x16 texture no mips + fillLevel(tex, 0, 16, 'cyan'); + + check('black', + "texture that is missing mips when TEXTURE_MIN_FILTER not NEAREST or LINEAR"); + + generateMipmap(); + + check('cyan', "texture that has all mips"); + + // Fill in the bottom 2 mips with a different color. + fillLevel(tex, 4, 1, 'green'); + fillLevel(tex, 3, 2, 'green'); + + // Choose the nearest mip + texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST); + + check('green', "texture that is only using the smallest 2 mips"); + + gl.uniform4f(multLoc, 16, 16, 1, 1); + + check('cyan', "texture that is using only the largest 2 mips"); + + // Set the top level + fillLevel(tex, 0, 1, 'red'); + check('red', + "texture that is only using the top level even though other levels are defined"); + + // Set the top 2 levels using generateMipmap + fillLevel(tex, 0, 2, 'blue'); + generateMipmap(); + + check('blue', + "texture that is only using the top 2 levels even though other levels are defined"); + + // Set the top 2 levels back to sizes that end up using levels 2, 3, and 4 again. + fillLevel(tex, 0, 16, 'blue'); + fillLevel(tex, 1, 8, 'blue'); + check('blue', "texture that is only using the largest 2 mips"); + gl.uniform4f(multLoc, 1, 1, 1, 1); + check('green', "texture that is only using the smallest 2 mips"); + + // ---------------------------------------------------- + var tex = createTexture(); + gl.uniform4f(multLoc, 1, 1, 1, 1); + fillLevel(tex, 0, 8, 'cyan'); + generateMipmap(); + check('cyan', "texture that has 3 mips"); + + fillLevel(tex, 0, 16, 'blue'); + texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); + check('blue', "texture that is only using top mips"); + + fillLevel(tex, 0, 8, 'red'); + texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR_MIPMAP_NEAREST); + check('cyan', "texture that is only using smallest mips"); + + gl.uniform4f(multLoc, 16, 16, 1, 1); + check('red', "texture that is using only the largest mip"); + + // ---------------------------------------------------- + var tex = createTexture(); + gl.uniform4f(multLoc, 1, 1, 1, 1); + fillLevel(tex, 2, 1, 'green'); + fillLevel(tex, 1, 2, 'green'); + fillLevel(tex, 0, 4, 'green'); + check('green', "texture that was built smallest mip first"); + + // ---------------------------------------------------- + var tex = createTexture(); + gl.uniform4f(multLoc, 1, 1, 1, 1); + fillLevel(tex, 0, 16, 'red'); + generateMipmap(); + check('red', "texture with 1 genmipmaps"); + fillLevel(tex, 0, 16, 'blue'); + generateMipmap(); + fillLevel(tex, 0, 16, 'green'); + generateMipmap(); + check('green', "texture with 2 genmipmaps"); + + // ---------------------------------------------------- + wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors."); + + function createTexture() { + debug("<hr/>gl.createTexture()"); + mips = []; + makeDivMipChain(); + return gl.createTexture(); + } + + function texParameteri(target, pname, value) { + debug("gl.texParameteri(" + + wtu.glEnumToString(gl, target) + ", " + + wtu.glEnumToString(gl, pname) + ", " + + wtu.glEnumToString(gl, value) + ")") + gl.texParameteri(target, pname, value); + } + + function generateMipmap() { + debug("gl.generateMipmap(gl.TEXTURE_2D)"); + gl.generateMipmap(gl.TEXTURE_2D); + var mip0 = mips[0]; + var size = mip0.size; + var level = 1; + for(;;) { + size = Math.floor(size / 2); + if (!size) { + break; + } + setMipData(level, size, mip0.color); + ++level; + } + makeDivMipChain(); + } + + function check(color, msg) { + wtu.clearAndDrawUnitQuad(gl); + wtu.checkCanvas(gl, colors[color], msg + " should draw with " + color); + } + + function fillLevel(tex, level, size, color) { + setMipData(level, size, color); + debug("gl.texImage2D(gl.TEXTURE_2D, " + level + ", gl.RGBA, " + size + ", " + size + + ", 0, gl.RGBA, gl.UNSIGNED_BYTE, " + color + ");"); + wtu.fillTexture(gl, tex, size, size, colors[color], level); + makeDivMipChain(); + } + + function setMipData(level, size, color) { + mips[level] = { + size: size, + color: color + }; + } + + function makeDivMipChain(color) { + var html = [ + '<div style="height: 68px; margin-top: 5px">', + '<div style="float:left;">mips: </div>']; + for (var ii = 0; ii < 5; ++ii) { + var mip = mips[ii]; + if (mip) { + html.push(makeDivSquare(mip.size, mip.color)); + } else { + html.push(makeDivSquare(16, undefined)); + } + } + html.push("</div>"); + debug(html.join("")); + } + + function makeDivSquare(size, color) { + size *= 4; + var c = color ? colors[color] : [255,255,255]; + var border = color ? 'solid' : 'dashed'; + return '<div style="float:left; width: ' + size + 'px; height: ' + size + + 'px; background-color: ' + rgb(c) + + '; border: 1px ' + border + ' black; margin-right: 3px;"></div>'; + } + + function rgb(c) { + return 'rgb(' + c[0] + ',' + c[1] + ',' + c[2] +')'; + } +} + +init(); +var successfullyParsed = true; +</script> +<script src="../../../js/js-test-post.js"></script> + +</body> +</html> + |