draw-buffers-driver-hang.html (7605B)
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 Draw Buffers Driver Hang Conformance 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 <div id="description"></div> 18 <canvas id="canvas" width="64" height="64"> </canvas> 19 <div id="console"></div> 20 <script id="vshader" type="x-shader/x-vertex">#version 300 es 21 in vec4 a_position; 22 void main() { 23 gl_Position = a_position; 24 } 25 </script> 26 <script id="fshader" type="x-shader/x-fragment">#version 300 es 27 precision mediump float; 28 29 out vec4 my_FragColor; 30 void main() { 31 my_FragColor = vec4(1, 0, 0, 1); 32 } 33 </script> 34 <script> 35 "use strict"; 36 description("This is a regression test for a driver bug causing a hang in the driver and thereby the browser (crbug.com/696187).") 37 38 debug("Thanks to Andre Weissflog (@FlohOfWoe / @floooh) for this test."); 39 debug("If the bug exists, this test doesn't fail or time out per the harness; the browser basically hangs."); 40 41 var wtu = WebGLTestUtils; 42 var canvas = document.getElementById("canvas"); 43 var gl = wtu.create3DContext(canvas, { depth: true, stencil: true, alpha: false }, 2); 44 45 if (!gl) { 46 testFailed("WebGL context does not exist"); 47 } else { 48 testPassed("WebGL context exists"); 49 50 runTest(); 51 } 52 53 function runTest() { 54 // create a global VAO 55 let vao = gl.createVertexArray(); 56 gl.bindVertexArray(vao); 57 58 // create a 3 MSAA 'offscreen render targets', each consisting of: 59 // - 1 color texture which will hold the MSAA resolve result 60 // - 1 MSAA color renderbuffer 61 // plus one depth-stencil renderbuffer 62 let tex0 = gl.createTexture(); 63 gl.activeTexture(gl.TEXTURE0); 64 gl.bindTexture(gl.TEXTURE_2D, tex0); 65 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAX_LEVEL, 0); 66 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 67 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 68 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 69 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 70 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA8, 200, 200, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); 71 let c_rb0 = gl.createRenderbuffer(); 72 gl.bindRenderbuffer(gl.RENDERBUFFER, c_rb0); 73 gl.renderbufferStorageMultisample(gl.RENDERBUFFER, 4, gl.RGBA8, 200, 200); 74 let ds_rb = gl.createRenderbuffer(); 75 gl.bindRenderbuffer(gl.RENDERBUFFER, ds_rb); 76 gl.renderbufferStorageMultisample(gl.RENDERBUFFER, 4, gl.DEPTH24_STENCIL8, 200, 200); 77 78 // 2nd offscreen render target 79 let tex1 = gl.createTexture(); 80 gl.activeTexture(gl.TEXTURE0); 81 gl.bindTexture(gl.TEXTURE_2D, tex1); 82 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAX_LEVEL, 0); 83 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 84 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 85 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 86 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 87 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA8, 200, 200, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); 88 let c_rb1 = gl.createRenderbuffer(); 89 gl.bindRenderbuffer(gl.RENDERBUFFER, c_rb1); 90 gl.renderbufferStorageMultisample(gl.RENDERBUFFER, 4, gl.RGBA8, 200, 200); 91 92 // 3rd offscreen render target 93 let tex2 = gl.createTexture(); 94 gl.activeTexture(gl.TEXTURE0); 95 gl.bindTexture(gl.TEXTURE_2D, tex2); 96 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAX_LEVEL, 0); 97 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 98 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 99 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 100 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 101 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA8, 200, 200, 0, gl.RGBA, gl.UNSIGNED_BYTE, null); 102 let c_rb2 = gl.createRenderbuffer(); 103 gl.bindRenderbuffer(gl.RENDERBUFFER, c_rb2); 104 gl.renderbufferStorageMultisample(gl.RENDERBUFFER, 4, gl.RGBA8, 200, 200); 105 106 // an MRT framebuffer with the 3 MSAA renderbuffers and MSAA depth/stencil attachments 107 let mrt_fb = gl.createFramebuffer(); 108 gl.bindFramebuffer(gl.FRAMEBUFFER, mrt_fb); 109 gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.RENDERBUFFER, c_rb0); 110 gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT1, gl.RENDERBUFFER, c_rb1); 111 gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT2, gl.RENDERBUFFER, c_rb2); 112 gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.RENDERBUFFER, ds_rb); 113 gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.STENCIL_ATTACHMENT, gl.RENDERBUFFER, ds_rb); 114 gl.checkFramebufferStatus(gl.FRAMEBUFFER); 115 116 // 3 'MSAA resolve framebuffers' which are the target for the MSAA-resolve-blit, 117 // with the 3 color textures as color attachments 118 let res_fb0 = gl.createFramebuffer(); 119 gl.bindFramebuffer(gl.FRAMEBUFFER, res_fb0); 120 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex0, 0); 121 gl.checkFramebufferStatus(gl.FRAMEBUFFER); 122 let res_fb1 = gl.createFramebuffer(); 123 gl.bindFramebuffer(gl.FRAMEBUFFER, res_fb1); 124 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT1, gl.TEXTURE_2D, tex1, 0); 125 gl.checkFramebufferStatus(gl.FRAMEBUFFER); 126 let res_fb2 = gl.createFramebuffer(); 127 gl.bindFramebuffer(gl.FRAMEBUFFER, res_fb2); 128 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT2, gl.TEXTURE_2D, tex2, 0); 129 let frameNumber = 0; 130 131 function draw() { 132 // draw one frame 133 gl.bindFramebuffer(gl.FRAMEBUFFER, null); 134 gl.viewport(0, 0, 1024, 768); 135 136 //--- BEGIN: comment out the block begin BEGIN/END to make the demo run 137 // clear the 3 MSAA offscreen color renderbuffers and depth/stencil renderbuffer 138 gl.bindFramebuffer(gl.FRAMEBUFFER, mrt_fb); 139 gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1, gl.COLOR_ATTACHMENT2]); 140 gl.viewport(0, 0, 200, 200); 141 gl.depthMask(true); 142 gl.clearBufferfv(gl.COLOR, 0, [0.25,0.0,0.0,1.0]); 143 gl.clearBufferfv(gl.COLOR, 1, [0.0,0.25,0.0,1.0]); 144 gl.clearBufferfv(gl.COLOR, 2, [0.0,0.0,0.25,1.0]); 145 gl.clearBufferfi(gl.DEPTH_STENCIL, 0, 1.0, 0); 146 147 // the MSAA resolve operation 148 gl.bindFramebuffer(gl.READ_FRAMEBUFFER, mrt_fb); 149 gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, res_fb0); 150 gl.readBuffer(gl.COLOR_ATTACHMENT0); 151 gl.drawBuffers([gl.COLOR_ATTACHMENT0]); 152 gl.blitFramebuffer(0, 0, 200, 200, 0, 0, 200, 200, gl.COLOR_BUFFER_BIT, gl.NEAREST); 153 gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, res_fb1); 154 gl.readBuffer(gl.COLOR_ATTACHMENT1); 155 gl.drawBuffers([gl.COLOR_ATTACHMENT0]); 156 gl.blitFramebuffer(0, 0, 200, 200, 0, 0, 200, 200, gl.COLOR_BUFFER_BIT, gl.NEAREST); 157 gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, res_fb2); 158 gl.readBuffer(gl.COLOR_ATTACHMENT2); 159 gl.drawBuffers([gl.COLOR_ATTACHMENT0]); 160 gl.blitFramebuffer(0, 0, 200, 200, 0, 0, 200, 200, gl.COLOR_BUFFER_BIT, gl.NEAREST); 161 //--- END 162 163 // bind and clear the default framebuffer 164 gl.bindFramebuffer(gl.FRAMEBUFFER, null); 165 gl.viewport(0, 0, 1024, 768); 166 gl.clearColor(0.5, 0.5, 0.5, 1.0); 167 gl.clearDepth(1.0); 168 gl.clearStencil(0); 169 gl.clear(gl.COLOR_BUFFER_BIT|gl.STENCIL_BUFFER_BIT|gl.DEPTH_BUFFER_BIT); 170 171 if (++frameNumber < 10) { 172 requestAnimationFrame(draw); 173 } else { 174 finishTest(); 175 } 176 } 177 178 // Start the rendering loop 179 draw(); 180 } 181 182 debug(""); 183 var successfullyParsed = true; 184 </script> 185 186 </body> 187 </html>