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>