blitframebuffer-scissor-enabled.html (5960B)
1 <!-- 2 Copyright (c) 2019 The Khronos Group Inc. 3 Use of this source code is governed by an MIT-style license that can be 4 found in the LICENSE.txt file. 5 --> 6 7 <!DOCTYPE html> 8 <html> 9 <head> 10 <meta charset="utf-8"> 11 <title>WebGL BlitFramebuffer Tests</title> 12 <link rel="stylesheet" href="../../resources/js-test-style.css"/> 13 <script src="../../js/js-test-pre.js"></script> 14 <script src="../../js/webgl-test-utils.js"></script> 15 </head> 16 <body> 17 <canvas id="example" width="8" height="8"></canvas> 18 <div id="description"></div> 19 <div id="console"></div> 20 21 <script> 22 "use strict"; 23 24 var wtu = WebGLTestUtils; 25 description("This test verifies the functionality of blitFramebuffer when scissor test is enabled."); 26 27 var gl = wtu.create3DContext("example", undefined, 2); 28 29 // Define the src region and dst region for blitFramebuffer 30 var blit_src = [0, 0, 4, 4]; 31 var blit_dst = [2, 2, 6, 6]; 32 33 if (!gl) { 34 testFailed("WebGL context does not exist"); 35 } else { 36 testPassed("WebGL context exists"); 37 38 var bounds = [ 39 [0, 0, 4, 4], // Partially intersects with blitFramebuffer's dst region 40 [0, 0, 2, 2], // No intersection with blitFramebuffer's dst region 41 ]; 42 43 // We can compute the real drawing area by intersecting the scissor bound with dst region of blitting. 44 var intersections = [ 45 [2, 2, 4, 4], 46 [0, 0, 0, 0], 47 ]; 48 49 for (var ii = 0; ii < bounds.length; ++ii) { 50 blitframebuffer_scissor(gl.RGBA8, gl.RGBA8, bounds[ii], intersections[ii]); 51 blitframebuffer_scissor(gl.RGBA8, gl.SRGB8_ALPHA8, bounds[ii], intersections[ii]); 52 blitframebuffer_scissor(gl.SRGB8_ALPHA8, gl.RGBA8, bounds[ii], intersections[ii]); 53 blitframebuffer_scissor(gl.SRGB8_ALPHA8, gl.SRGB8_ALPHA8, bounds[ii], intersections[ii]); 54 } 55 } 56 57 function checkPixel(color, expectedColor) { 58 var tolerance = 3; 59 return (Math.abs(color[0] - expectedColor[0]) <= tolerance && 60 Math.abs(color[1] - expectedColor[1]) <= tolerance && 61 Math.abs(color[2] - expectedColor[2]) <= tolerance && 62 Math.abs(color[3] - expectedColor[3]) <= tolerance); 63 } 64 65 function blitframebuffer_scissor(readbufferFormat, drawbufferFormat, bound, intersection) { 66 debug(""); 67 debug("read buffer format is: " + wtu.glEnumToString(gl, readbufferFormat) + ", draw buffer format is: " + wtu.glEnumToString(gl, drawbufferFormat)); 68 69 70 // Initiate data to read framebuffer 71 var size = 8; 72 var data = new Uint8Array(size * size * 4); 73 var color = [250, 100, 15, 255]; 74 for (var ii = 0; ii < size * size * 4; ii += 4) { 75 for (var jj = 0; jj < 4; ++jj) { 76 data[ii + jj] = color[jj]; 77 } 78 } 79 80 // Feed data to read buffer. Feed 0 to draw buffer. 81 var tex_read = gl.createTexture(); 82 gl.bindTexture(gl.TEXTURE_2D, tex_read); 83 gl.texImage2D(gl.TEXTURE_2D, 0, readbufferFormat, size, size, 0, gl.RGBA, gl.UNSIGNED_BYTE, data); 84 85 var fbo_read = gl.createFramebuffer(); 86 gl.bindFramebuffer(gl.READ_FRAMEBUFFER, fbo_read); 87 gl.framebufferTexture2D(gl.READ_FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex_read, 0); 88 89 var tex_draw = gl.createTexture(); 90 gl.bindTexture(gl.TEXTURE_2D, tex_draw); 91 gl.texImage2D(gl.TEXTURE_2D, 0, drawbufferFormat, size, size, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); 92 93 var fbo_draw = gl.createFramebuffer(); 94 gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, fbo_draw); 95 gl.framebufferTexture2D(gl.DRAW_FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex_draw, 0); 96 if (gl.checkFramebufferStatus(gl.READ_FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE || gl.checkFramebufferStatus(gl.DRAW_FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE) { 97 testFailed("Framebuffer incomplete."); 98 return; 99 } 100 101 // Enable scissor test. Then blit framebuffer. 102 gl.enable(gl.SCISSOR_TEST); 103 gl.scissor(bound[0], bound[1], bound[2], bound[3]); 104 gl.blitFramebuffer(blit_src[0], blit_src[1], blit_src[2], blit_src[3], blit_dst[0], blit_dst[1], blit_dst[2], blit_dst[3], gl.COLOR_BUFFER_BIT, gl.LINEAR); 105 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "blitframebuffer should succeed"); 106 107 // Read pixels and Comparison 108 var pixels = new Uint8Array(size * size * 4); 109 gl.bindFramebuffer(gl.READ_FRAMEBUFFER, fbo_draw); 110 gl.readPixels(0, 0, size, size, gl.RGBA, gl.UNSIGNED_BYTE, pixels); 111 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "readPixels should succeed"); 112 113 var blitColor; 114 var expectedColor; 115 var clearColor = [0, 0, 0, 0]; 116 117 if (readbufferFormat == drawbufferFormat) { 118 blitColor = color; 119 } else if (readbufferFormat == gl.SRGB8_ALPHA8) { 120 blitColor = wtu.sRGBToLinear(color); 121 } else { 122 blitColor = wtu.linearToSRGB(color); 123 } 124 125 var failed = false; 126 for (var ii = 0; ii < size; ++ii) { 127 for (var jj = 0; jj < size; ++jj) { 128 if (ii >= intersection[0] && jj >= intersection[1] && ii < intersection[2] && jj < intersection[3]) { 129 expectedColor = blitColor; 130 } else { 131 expectedColor = clearColor; 132 } 133 var index = (ii * size + jj) * 4; 134 var pixelColor = [pixels[index], pixels[index + 1], pixels[index + 2], pixels[index + 3]]; 135 if (checkPixel(pixelColor, expectedColor) == false) { 136 failed = true; 137 debug("Pixels comparison failed. Pixel at [" + jj + ", " + ii + "] should be (" + expectedColor + "), but the actual color is (" + pixelColor + ")"); 138 } 139 } 140 } 141 if (failed == false) { 142 testPassed("All pixels comparision passed!"); 143 } 144 145 // Deinit 146 gl.bindTexture(gl.TEXTURE_2D, null); 147 gl.bindFramebuffer(gl.READ_FRAMEBUFFER, null); 148 gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, null); 149 gl.deleteFramebuffer(fbo_read); 150 gl.deleteFramebuffer(fbo_draw); 151 gl.deleteTexture(tex_read); 152 gl.deleteTexture(tex_draw); 153 }; 154 155 var successfullyParsed = true; 156 </script> 157 <script src="../../js/js-test-post.js"></script> 158 159 </body> 160 </html>