diff options
Diffstat (limited to '')
-rw-r--r-- | dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-hd-dpi.html | 117 |
1 files changed, 117 insertions, 0 deletions
diff --git a/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-hd-dpi.html b/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-hd-dpi.html new file mode 100644 index 0000000000..5126fad9f7 --- /dev/null +++ b/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/texture-hd-dpi.html @@ -0,0 +1,117 @@ +<!-- +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 HD-DPI issues texture 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="4" height="4" style="width: 40px; height: 30px;"></canvas> +<div id="description"></div> +<div id="console"></div> +<script> +"use strict"; +description(); +var wtu = WebGLTestUtils; +var gl = wtu.create3DContext("example"); +var program = wtu.setupTexturedQuad(gl); + +function fillInMips(gl, size) { + // fill in the mips + var level = 1; + for (;;) { + size /= 2; + if (size < 1) { + break; + } + var numBytes = size * size * 4; + var pixels = new Uint8Array(numBytes); + for (var jj = 0; jj < numBytes; jj += 4) { + pixels[jj + 0] = 0; + pixels[jj + 1] = 255; + pixels[jj + 2] = 0; + pixels[jj + 3] = 255; + } + gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, size, size, 0, gl.RGBA, gl.UNSIGNED_BYTE, pixels); + } +} + +function testCanvas(size) { + debug(""); + debug("testing 2D canvas size " + size + ", " + size); + + var canvas = document.createElement("canvas"); + canvas.width = size; + canvas.height = size; + var ctx = canvas.getContext("2d"); + ctx.fillStyle = "rgb(0,255,0)"; + ctx.fillRect(0, 0, size, size); + + var tex = gl.createTexture(); + gl.bindTexture(gl.TEXTURE_2D, tex); + gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas); + + fillInMips(gl, size); + + // Draw. If this an HD-DPI device and the 2d canvas is double res or larger + // the implementation must scale to CSS pixels (ie, canvas.width, canvas.height)( + // when doing the copy in texImage2D. If it has not scaled and instead done + // a direct copy of the larger texture this test will not have created enough mips + // and will therefore not be "texture complete" and will render in black. + wtu.clearAndDrawUnitQuad(gl); + wtu.checkCanvas(gl, [0, 255, 0, 255], "should be green"); +} + +function testWebGL(size) { + debug(""); + debug("testing WebGL canvas size " + size + ", " + size); + + var canvas = document.createElement("canvas"); + canvas.width = size; + canvas.height = size; + var gl2 = wtu.create3DContext(canvas); + gl2.clearColor(0,1,0,1); + gl2.clear(gl.COLOR_BUFFER_BIT); + + var tex = gl.createTexture(); + gl.bindTexture(gl.TEXTURE_2D, tex); + gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas); + + fillInMips(gl, size); + + // Draw. If this an HD-DPI device check for 2 possible bugs. + // + // 1) the WebGL canvas is double res or larger. That's just a bug period and + // is checked for in another test but would also fail here. + // + // 2) the WebGL canvas is single res but the code the scales a double res + // 2d canvas also mistakenly scales a single res WebGL canvas. + // + // If it has been scaled then we'll have the wrong kind of mips chain here. + // Level 0 will be half resolution. Level 1 will be the same resolution + // and will therefore not be "texture complete" and will render in black. + wtu.clearAndDrawUnitQuad(gl); + wtu.checkCanvas(gl, [0, 255, 0, 255], "should be green"); +} + +testCanvas(4); +testCanvas(512); +testWebGL(4); +testWebGL(512); +wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors"); + +var successfullyParsed = true; +</script> +<script src="../../../js/js-test-post.js"></script> + +</body> +</html> + |