gl-scissor-fbo-test.html (4292B)
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 Scissor FBO Test</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="canvas" width="16" height="16" style="width: 40px; height: 40px;"> </canvas> 18 <canvas id="canvas2" width="16" height="16" style="width: 40px; height: 40px;"> </canvas> 19 <div id="description"></div> 20 <div id="console"></div> 21 <script> 22 "use strict"; 23 description("Checks the scissor does not change when switching framebuffers."); 24 25 var wtu = WebGLTestUtils; 26 var gl; 27 28 function makeFramebuffer(width, height) { 29 var tex = gl.createTexture(); 30 gl.bindTexture(gl.TEXTURE_2D, tex); 31 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width, height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); 32 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 33 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 34 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 35 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 36 var fb = gl.createFramebuffer(); 37 gl.bindFramebuffer(gl.FRAMEBUFFER, fb); 38 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex, 0); 39 shouldBe('gl.checkFramebufferStatus(gl.FRAMEBUFFER)', 'gl.FRAMEBUFFER_COMPLETE'); 40 gl.bindFramebuffer(gl.FRAMEBUFFER, null); 41 return fb; 42 } 43 44 function checkCanvasRect(x, y, width, height, color, msg) { 45 debug("checking: " + x + ", " + y + ", " + width + ", " + height); 46 wtu.checkCanvasRect(gl, x, y, width, height, color, msg); 47 } 48 49 function runEntireTest(canvasName, antialias) { 50 debug(""); 51 debug("== Running scissor fbo test with antialias:" + antialias + " =="); 52 debug(""); 53 54 gl = wtu.create3DContext(canvasName, {antialias: antialias}); 55 if (!gl) { 56 testFailed("context does not exist"); 57 return; 58 } 59 testPassed("context exists"); 60 61 var fb8x8 = makeFramebuffer(8, 8); 62 var fb32x32 = makeFramebuffer(32, 32); 63 64 var testScissor = function(scissorX, scissorY, scissorWidth, scissorHeight, msg) { 65 debug(""); 66 debug(msg); 67 68 var test = function(fb, size) { 69 debug(""); 70 debug("checking size: " + size); 71 gl.bindFramebuffer(gl.FRAMEBUFFER, fb); 72 gl.clearColor(0, 1, 0, 1); 73 gl.clear(gl.COLOR_BUFFER_BIT); 74 var scissorRight = Math.min(scissorX + scissorWidth, size); 75 var scissorTop = Math.min(scissorY + scissorHeight, size); 76 var scWidth = scissorRight - scissorX; 77 var scHeight = scissorTop - scissorY; 78 var rightWidth = Math.min(size - scissorRight, 0); 79 var topHeight = Math.max(size - scissorTop, 0); 80 checkCanvasRect(scissorX, scissorY, scWidth, scHeight, [0, 255, 0, 255], "should be green"); 81 checkCanvasRect(0, 0, size, scissorY, [255, 0, 0, 255], "should be red"); 82 checkCanvasRect(0, scissorTop, size, topHeight, [255, 0, 0, 255], "should be red"); 83 checkCanvasRect(0, 0, scissorX, size, [255, 0, 0, 255], "should be red"); 84 checkCanvasRect(scissorRight, 0, scissorX, rightWidth, [255, 0, 0, 255], "should be red"); 85 }; 86 87 gl.disable(gl.SCISSOR_TEST); 88 gl.clearColor(1, 0, 0, 1); 89 gl.bindFramebuffer(gl.FRAMEBUFFER, null); 90 gl.clear(gl.COLOR_BUFFER_BIT); 91 gl.bindFramebuffer(gl.FRAMEBUFFER, fb8x8); 92 gl.clear(gl.COLOR_BUFFER_BIT); 93 gl.bindFramebuffer(gl.FRAMEBUFFER, fb32x32); 94 gl.clear(gl.COLOR_BUFFER_BIT); 95 96 gl.bindFramebuffer(gl.FRAMEBUFFER, fb32x32); 97 gl.enable(gl.SCISSOR_TEST); 98 gl.scissor(scissorX, scissorY, scissorWidth, scissorHeight); 99 test(null, 16); 100 test(fb8x8, 8); 101 test(fb32x32, 32); 102 test(null, 16); 103 }; 104 105 testScissor(2, 4, 12, 10, "test scissor in middle"); 106 testScissor(0, 0, 12, 10, "test scissor at 0,0"); 107 testScissor(0, 0, 16, 16, "test scissor with size that matches drawingbuffer"); 108 109 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "there should be no errors"); 110 } 111 112 runEntireTest("canvas", false); 113 runEntireTest("canvas2", true); 114 115 debug(""); 116 var successfullyParsed = true; 117 </script> 118 <script src="../../js/js-test-post.js"></script> 119 120 </body> 121 </html>