diff options
Diffstat (limited to 'dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/canvas-teximage-after-multiple-drawimages.html')
-rw-r--r-- | dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/canvas-teximage-after-multiple-drawimages.html | 100 |
1 files changed, 100 insertions, 0 deletions
diff --git a/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/canvas-teximage-after-multiple-drawimages.html b/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/canvas-teximage-after-multiple-drawimages.html new file mode 100644 index 0000000000..0c5d45b7b0 --- /dev/null +++ b/dom/canvas/test/webgl-conf/checkout/conformance/textures/misc/canvas-teximage-after-multiple-drawimages.html @@ -0,0 +1,100 @@ +<!-- +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>TexImage2D of 2D Canvas after multiple drawImages</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> +<script> +"use strict"; +const wtu = WebGLTestUtils; + +const sz = 512; +let greenImage = null; + +function loadImageAndStart(startFunc) { + let c = document.createElement('canvas'); + c.width = sz; + c.height = sz; + let ctx = c.getContext('2d'); + ctx.fillStyle = 'rgb(0,255,0)'; + ctx.fillRect(0, 0, sz, sz); + greenImage = wtu.makeImageFromCanvas(c, startFunc); +} + +function runTest() { + description(); + debug('Regression test for <a href="http://crbug.com/878545">http://crbug.com/878545</a>'); + // Mimics the image-to-texture upload path from the old JavaScript + // port of O3D, salvaged at https://github.com/petersont/o3d . + + // Create a canvas and draw the entire image into it. + let bigCanvas = document.createElement('canvas'); + bigCanvas.width = greenImage.naturalWidth; + bigCanvas.height = greenImage.naturalHeight; + let bc = bigCanvas.getContext('2d'); + bc.drawImage(greenImage, 0, 0, bigCanvas.width, bigCanvas.height); + // Create a temp canvas to flip vertically. + let tempCanvas = document.createElement('canvas'); + tempCanvas.width = bigCanvas.width; + tempCanvas.height = bigCanvas.height; + let tc = tempCanvas.getContext('2d'); + tc.translate(0, tempCanvas.height); + tc.scale(1, -1); + tc.drawImage(bigCanvas, 0, 0, tempCanvas.width, tempCanvas.height); + // Set up to draw via WebGL. + let c3d = document.getElementById('canvas'); + let gl = wtu.create3DContext(c3d); + let prog = wtu.setupTexturedQuad(gl); + gl.uniform1i(gl.getUniformLocation(prog, 'tex'), 0); + let tex = gl.createTexture(); + // Iterate through the large canvas, drawing pieces of it to a + // scratch canvas. + let scratchCanvas = document.createElement('canvas'); + const width = tempCanvas.width / 2; + const height = tempCanvas.height / 2; + let bb = new Uint8Array(4 * c3d.width * c3d.height); + for (let jj = 0; jj < 2; ++jj) { + for (let ii = 0; ii < 2; ++ii) { + // Prepare texture. + scratchCanvas.width = width; + scratchCanvas.height = height; + let ctx = scratchCanvas.getContext('2d'); + ctx.save(); + ctx.translate(-(ii * width), -(jj * height)); + ctx.scale(1.0, 1.0); + ctx.drawImage(tempCanvas, 0, 0, tempCanvas.width, tempCanvas.height); + gl.bindTexture(gl.TEXTURE_2D, tex); + gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, + scratchCanvas); + ctx.restore(); + gl.generateMipmap(gl.TEXTURE_2D); + // Draw and check that rendering occurred properly. + gl.uniform1i(gl.getUniformLocation(prog, 'tex'), 0); + wtu.drawUnitQuad(gl); + let tolerance = 2; + wtu.checkCanvasRect(gl, 1, 1, c3d.width - 2, c3d.height - 2, + [ 0, 255, 0, 255 ], + "should be green", + tolerance); + + } + } + + finishTest(); +} +</script> +</head> +<body onload="loadImageAndStart(runTest)"> +<div id="description"></div> +<div id="console"></div> +<canvas id="canvas" width="40" height="40"></canvas> +</body> +</html> |