depth-stencil-feedback-loop.html (6058B)
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 Rendering and Sampling Feedback Loop Tests for Depth/Stencil Buffer</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 id="vshader" type="x-shader/x-vertex">#version 300 es 22 in highp vec4 aPosition; 23 in vec2 aTexCoord; 24 out vec2 texCoord; 25 void main() { 26 gl_Position = aPosition; 27 texCoord = aTexCoord; 28 } 29 </script> 30 31 <script id="fshader" type="x-shader/x-fragment">#version 300 es 32 precision mediump float; 33 uniform sampler2D tex; 34 in vec2 texCoord; 35 out vec4 oColor; 36 void main() { 37 oColor = texture(tex, texCoord); 38 } 39 </script> 40 41 <script> 42 "use strict"; 43 44 var wtu = WebGLTestUtils; 45 description("This test verifies the functionality of rendering to the same texture where it samples from."); 46 47 var gl = wtu.create3DContext("example", undefined, 2); 48 49 var width = 8; 50 var height = 8; 51 var tex0; 52 var tex1; 53 var tex2; 54 var fbo; 55 var program; 56 var positionLoc; 57 var texCoordLoc; 58 59 if (!gl) { 60 testFailed("WebGL context does not exist"); 61 } else { 62 testPassed("WebGL context exists"); 63 64 init(); 65 detect_depth_stencil_feedback_loop(); 66 deinit(); 67 } 68 69 function init() { 70 // Setup program 71 program = wtu.setupProgram(gl, ['vshader', 'fshader'], ['aPosition', 'aTexCoord'], [0, 1]); 72 positionLoc = gl.getAttribLocation(program, "aPosition"); 73 texCoordLoc = gl.getAttribLocation(program, "aTexCoord"); 74 if (!program || positionLoc < 0 || texCoordLoc < 0) { 75 testFailed("Set up program failed"); 76 return; 77 } 78 testPassed("Set up program succeeded"); 79 80 wtu.setupUnitQuad(gl, 0, 1); 81 gl.viewport(0, 0, width, height); 82 83 var texLoc = gl.getUniformLocation(program, "tex"); 84 gl.uniform1i(texLoc, 0); 85 86 // Create textures and allocate storage 87 tex0 = gl.createTexture(); 88 tex1 = gl.createTexture(); 89 tex2 = gl.createTexture(); 90 wtu.fillTexture(gl, tex0, width, height, [0x0, 0xff, 0x0, 0xff], 0, gl.RGBA, gl.UNSIGNED_BYTE, gl.RGBA); 91 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 92 wtu.fillTexture(gl, tex1, width, height, [0x80], 0, gl.DEPTH_COMPONENT, gl.UNSIGNED_INT, gl.DEPTH_COMPONENT16); 93 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 94 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 95 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_COMPARE_MODE, gl.COMPARE_REF_TO_TEXTURE); 96 wtu.fillTexture(gl, tex2, width, height, [0x40], 0, gl.DEPTH_STENCIL, gl.UNSIGNED_INT_24_8, gl.DEPTH24_STENCIL8); 97 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST); 98 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST); 99 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_COMPARE_MODE, gl.COMPARE_REF_TO_TEXTURE); 100 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Succeed to create textures."); 101 102 fbo = gl.createFramebuffer(); 103 gl.bindFramebuffer(gl.FRAMEBUFFER, fbo); 104 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex0, 0); 105 } 106 107 function detect_depth_stencil_feedback_loop() { 108 // Test rendering and sampling feedback loop for depth buffer 109 gl.bindTexture(gl.TEXTURE_2D, tex1); 110 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, tex1, 0); 111 if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE) { 112 testFailed("Framebuffer incomplete."); 113 return; 114 } 115 gl.enable(gl.DEPTH_TEST); 116 wtu.clearAndDrawUnitQuad(gl); 117 wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "The test samples from a image. The same image is used as depth buffer during rendering."); 118 119 gl.depthMask(gl.FALSE); 120 wtu.clearAndDrawUnitQuad(gl); 121 wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "The test samples from a image. The same image is used as depth buffer. A feedback loop is formed regardless of the status of depth mask."); 122 123 gl.depthMask(gl.TRUE); 124 gl.disable(gl.DEPTH_TEST); 125 wtu.clearAndDrawUnitQuad(gl); 126 wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "The test samples from a image. The same image is used as depth buffer. A feedback loop is formed regardless of whether the depth test is enabled."); 127 128 // Test rendering and sampling feedback loop for stencil buffer 129 gl.bindTexture(gl.TEXTURE_2D, tex2); 130 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, null, 0); 131 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.STENCIL_ATTACHMENT, gl.TEXTURE_2D, tex2, 0); 132 if (gl.checkFramebufferStatus(gl.FRAMEBUFFER) != gl.FRAMEBUFFER_COMPLETE) { 133 testFailed("Framebuffer incomplete."); 134 return; 135 } 136 137 gl.enable(gl.STENCIL_TEST); 138 wtu.clearAndDrawUnitQuad(gl); 139 wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "The test samples from a image. The same image is used as stencil buffer during rendering."); 140 141 gl.stencilMask(0x0); 142 wtu.clearAndDrawUnitQuad(gl); 143 wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "The test sampls from a image. The same image is used as stencil buffer. A feedback loop is formed regardless of the status of stencil mask."); 144 145 gl.stencilMask(0xffff); 146 gl.disable(gl.STENCIL_TEST); 147 wtu.clearAndDrawUnitQuad(gl); 148 wtu.glErrorShouldBe(gl, gl.INVALID_OPERATION, "The test samples from a image. The same image is used as stencil buffer. A feedback loop is formed regardless of whether the stencil test is enabled."); 149 } 150 151 function deinit() { 152 gl.bindTexture(gl.TEXTURE_2D, null); 153 gl.bindFramebuffer(gl.FRAMEBUFFER, null); 154 gl.deleteTexture(tex0); 155 gl.deleteTexture(tex1); 156 gl.deleteTexture(tex2); 157 gl.deleteFramebuffer(fbo); 158 } 159 160 var successfullyParsed = true; 161 </script> 162 <script src="../../js/js-test-post.js"></script> 163 164 </body> 165 </html>