LayoutTests/fast/canvas/webgl/tex-image-and-sub-image-2d-with-image-data.html - WebKit - Git at Google

 <html>
 <head>
 <script src="../../js/resources/js-test-pre.js"></script>
 <script src="resources/webgl-test.js"></script>
 <script src="resources/webgl-test-utils.js"></script>
 <script>
 var wtu = WebGLTestUtils;
 var gl = null;
 var textureLoc = null;
 var successfullyParsed = false;
 var imageData = null;

 function init()
 {
     if (window.initNonKhronosFramework) {
         window.initNonKhronosFramework(true);
     }

     description('Verify texImage2D and texSubImage2D code paths taking ImageData');

     var canvas2d = document.getElementById("texcanvas");
     var context2d = canvas2d.getContext("2d");
     imageData = context2d.createImageData(1, 2);
     var data = imageData.data;
     data[0] = 255;
     data[1] = 0;
     data[2] = 0;
     data[3] = 255;
     data[4] = 0;
     data[5] = 255;
     data[6] = 0;
     data[7] = 0;

     wtu = WebGLTestUtils;
     var canvas = document.getElementById("example");
     gl = wtu.create3DContext(canvas);
     var program = wtu.setupTexturedQuad(gl);
     gl.clearColor(0,0,0,1);
     gl.clearDepth(1);
     gl.disable(gl.BLEND);

     textureLoc = gl.getUniformLocation(program, "tex");

     runTest();
 }

 // These two declarations need to be global for "shouldBe" to see them
 var buf = null;
 var idx = 0;
 var pixel = [0, 0, 0, 1];
 var correctColor = null;

 function runOneIteration(useTexSubImage2D, flipY, premultiplyAlpha, topColor, bottomColor)
 {
     debug('Testing ' + (useTexSubImage2D ? 'texSubImage2D' : 'texImage2D') +
           ' with flipY=' + flipY + ' and premultiplyAlpha=' + premultiplyAlpha);
     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
     // Enable writes to the RGBA channels
     gl.colorMask(1, 1, 1, 0);
     var texture = gl.createTexture();
     // Bind the texture to texture unit 0
     gl.bindTexture(gl.TEXTURE_2D, texture);
     // Set up texture parameters
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
     // Set up pixel store parameters
     gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipY);
     gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, premultiplyAlpha);
     // Upload the image into the texture
     if (useTexSubImage2D) {
         // Initialize the texture to black first
         gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 2, 0,
                       gl.RGBA, gl.UNSIGNED_BYTE, null);
         gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
     } else {
         gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
     }

     // Point the uniform sampler to texture unit 0
     gl.uniform1i(textureLoc, 0);
     // Draw the triangles
     wtu.drawQuad(gl, [0, 0, 0, 255]);

     // Read back the rendering results
     buf = new Uint8Array(1 * 2 * 4);
     gl.readPixels(0, 0, 1, 2, gl.RGBA, gl.UNSIGNED_BYTE, buf);
     // Check the top pixel and bottom pixel and make sure they have
     // the right color.
     debug("Checking bottom pixel");
     wtu.checkCanvasRect(gl, 0, 0, 1, 1, bottomColor, "shouldBe " + bottomColor);
     debug("Checking top pixel");
     wtu.checkCanvasRect(gl, 0, 1, 1, 1, topColor, "shouldBe " + topColor);
 }

 function runTest()
 {
     var red = [255, 0, 0, 255];
     var green = [0, 255, 0, 255];
     var redPremultiplyAlpha = [255, 0, 0, 255];
     var greenPremultiplyAlpha = [0, 0, 0, 255];

     runOneIteration(false, true, false,
                     red, green);
     runOneIteration(false, false, false,
                     green, red);
     runOneIteration(false, true, true,
                     redPremultiplyAlpha, greenPremultiplyAlpha);
     runOneIteration(false, false, true,
                     greenPremultiplyAlpha, redPremultiplyAlpha);
     runOneIteration(true, true, false,
                     red, green);
     runOneIteration(true, false, false,
                     green, red);
     runOneIteration(true, true, true,
                     redPremultiplyAlpha, greenPremultiplyAlpha);
     runOneIteration(true, false, true,
                     greenPremultiplyAlpha, redPremultiplyAlpha);

     successfullyParsed = true;
     var epilogue = document.createElement("script");
     epilogue.onload = finish;
     epilogue.src = "../../js/resources/js-test-post.js";
     document.body.appendChild(epilogue);
 }

 function finish() {
     if (window.nonKhronosFrameworkNotifyDone) {
         window.nonKhronosFrameworkNotifyDone();
     }
 }
 </script>
 </head>
 <body onload="init()">
 <canvas id="texcanvas" width="1px" height="2px"></canvas>
 <canvas id="example" width="1px" height="2px"></canvas>
 <div id="description"></div>
 <div id="console"></div>
 </body>
 </html>
	<html>
	<head>
	<script src="../../js/resources/js-test-pre.js"></script>
	<script src="resources/webgl-test.js"></script>
	<script src="resources/webgl-test-utils.js"></script>
	<script>
	var wtu = WebGLTestUtils;
	var gl = null;
	var textureLoc = null;
	var successfullyParsed = false;
	var imageData = null;

	function init()
	{
	if (window.initNonKhronosFramework) {
	window.initNonKhronosFramework(true);
	}

	description('Verify texImage2D and texSubImage2D code paths taking ImageData');

	var canvas2d = document.getElementById("texcanvas");
	var context2d = canvas2d.getContext("2d");
	imageData = context2d.createImageData(1, 2);
	var data = imageData.data;
	data[0] = 255;
	data[1] = 0;
	data[2] = 0;
	data[3] = 255;
	data[4] = 0;
	data[5] = 255;
	data[6] = 0;
	data[7] = 0;

	wtu = WebGLTestUtils;
	var canvas = document.getElementById("example");
	gl = wtu.create3DContext(canvas);
	var program = wtu.setupTexturedQuad(gl);
	gl.clearColor(0,0,0,1);
	gl.clearDepth(1);
	gl.disable(gl.BLEND);

	textureLoc = gl.getUniformLocation(program, "tex");

	runTest();
	}

	// These two declarations need to be global for "shouldBe" to see them
	var buf = null;
	var idx = 0;
	var pixel = [0, 0, 0, 1];
	var correctColor = null;

	function runOneIteration(useTexSubImage2D, flipY, premultiplyAlpha, topColor, bottomColor)
	{
	debug('Testing ' + (useTexSubImage2D ? 'texSubImage2D' : 'texImage2D') +
	' with flipY=' + flipY + ' and premultiplyAlpha=' + premultiplyAlpha);
	gl.clear(gl.COLOR_BUFFER_BIT \| gl.DEPTH_BUFFER_BIT);
	// Enable writes to the RGBA channels
	gl.colorMask(1, 1, 1, 0);
	var texture = gl.createTexture();
	// Bind the texture to texture unit 0
	gl.bindTexture(gl.TEXTURE_2D, texture);
	// Set up texture parameters
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
	gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
	// Set up pixel store parameters
	gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, flipY);
	gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, premultiplyAlpha);
	// Upload the image into the texture
	if (useTexSubImage2D) {
	// Initialize the texture to black first
	gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 1, 2, 0,
	gl.RGBA, gl.UNSIGNED_BYTE, null);
	gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
	} else {
	gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, imageData);
	}

	// Point the uniform sampler to texture unit 0
	gl.uniform1i(textureLoc, 0);
	// Draw the triangles
	wtu.drawQuad(gl, [0, 0, 0, 255]);

	// Read back the rendering results
	buf = new Uint8Array(1 * 2 * 4);
	gl.readPixels(0, 0, 1, 2, gl.RGBA, gl.UNSIGNED_BYTE, buf);
	// Check the top pixel and bottom pixel and make sure they have
	// the right color.
	debug("Checking bottom pixel");
	wtu.checkCanvasRect(gl, 0, 0, 1, 1, bottomColor, "shouldBe " + bottomColor);
	debug("Checking top pixel");
	wtu.checkCanvasRect(gl, 0, 1, 1, 1, topColor, "shouldBe " + topColor);
	}

	function runTest()
	{
	var red = [255, 0, 0, 255];
	var green = [0, 255, 0, 255];
	var redPremultiplyAlpha = [255, 0, 0, 255];
	var greenPremultiplyAlpha = [0, 0, 0, 255];

	runOneIteration(false, true, false,
	red, green);
	runOneIteration(false, false, false,
	green, red);
	runOneIteration(false, true, true,
	redPremultiplyAlpha, greenPremultiplyAlpha);
	runOneIteration(false, false, true,
	greenPremultiplyAlpha, redPremultiplyAlpha);
	runOneIteration(true, true, false,
	red, green);
	runOneIteration(true, false, false,
	green, red);
	runOneIteration(true, true, true,
	redPremultiplyAlpha, greenPremultiplyAlpha);
	runOneIteration(true, false, true,
	greenPremultiplyAlpha, redPremultiplyAlpha);

	successfullyParsed = true;
	var epilogue = document.createElement("script");
	epilogue.onload = finish;
	epilogue.src = "../../js/resources/js-test-post.js";
	document.body.appendChild(epilogue);
	}

	function finish() {
	if (window.nonKhronosFrameworkNotifyDone) {
	window.nonKhronosFrameworkNotifyDone();
	}
	}
	</script>
	</head>
	<body onload="init()">
	<canvas id="texcanvas" width="1px" height="2px"></canvas>
	<canvas id="example" width="1px" height="2px"></canvas>
	<div id="description"></div>
	<div id="console"></div>
	</body>
	</html>