fbo-lost-context.html (5713B)
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 FBO Lost Context Test</title> 12 <link rel="stylesheet" href="../resources/js-test-style.css"/> 13 <script src="../../devtools/src/debug/webgl-debug.js"></script> 14 <script src="../js/js-test-pre.js"></script> 15 <script src="../js/webgl-test-utils.js"></script> 16 </head> 17 <body> 18 <div id="description"></div> 19 <div id="console"></div> 20 <script id="vshader" type="x-shader/x-vertex"> 21 attribute vec4 vPosition; 22 attribute vec2 texCoord0; 23 uniform mat4 world; 24 varying vec2 texCoord; 25 void main() 26 { 27 gl_Position = vPosition * world; 28 texCoord = texCoord0; 29 } 30 </script> 31 32 <script id="fshader" type="x-shader/x-fragment"> 33 precision mediump float; 34 uniform sampler2D tex; 35 varying vec2 texCoord; 36 void main() 37 { 38 gl_FragColor = texture2D(tex, texCoord); 39 } 40 </script> 41 <canvas id="canvas" width="1024" height="1024"> </canvas> 42 <script> 43 "use strict"; 44 description("This test is to help see if an WebGL app *can* get lost context."); 45 46 debug(""); 47 debug("Canvas.getContext"); 48 var wtu = WebGLTestUtils; 49 var g_worldLoc; 50 var g_texLoc; 51 var g_textures = []; 52 var gl = wtu.create3DContext("canvas"); 53 if (!gl) { 54 testFailed("context does not exist"); 55 } else { 56 testPassed("context exists"); 57 58 debug(""); 59 debug("Checking for out of memory handling."); 60 61 var program = wtu.setupProgram(["vshader", "fshader"], ["vPosition", "texCoord0"]); 62 var size = gl.getParameter(gl.MAX_RENDERBUFFER_SIZE); 63 debug("max render buffer size: " + size); 64 size = size / 2; 65 debug("size used: " + size); 66 67 var allocateFramebuffers = true; 68 var itervalId; 69 var count = 0; 70 71 gl = WebGLDebugUtils.makeDebugContext(gl, function(err, functionName, args) { 72 window.clearInterval(intervalId); 73 assertMsg(err == gl.OUT_OF_MEMORY, 74 "correctly returns gl.OUT_OF_MEMORY when out of memory"); 75 finish(); 76 }); 77 78 function createFBO() { 79 var tex = gl.createTexture(); 80 gl.bindTexture(gl.TEXTURE_2D, tex); 81 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 82 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 83 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 84 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 85 gl.texImage2D(gl.TEXTURE_2D, 86 0, // level 87 gl.RGBA, // internalFormat 88 size, // width 89 size, // height 90 0, // border 91 gl.RGBA, // format 92 gl.UNSIGNED_BYTE, // type 93 null); // data 94 var fb = gl.createFramebuffer(); 95 gl.bindFramebuffer(gl.FRAMEBUFFER, fb); 96 gl.framebufferTexture2D( 97 gl.FRAMEBUFFER, 98 gl.COLOR_ATTACHMENT0, 99 gl.TEXTURE_2D, 100 tex, 101 0); 102 var status = gl.checkFramebufferStatus(gl.FRAMEBUFFER); 103 if (status != gl.FRAMEBUFFER_COMPLETE) { 104 testFailed("gl.checkFramebufferStatus() returned " + WebGLTestUtils.glEnumToString(gl, status)); 105 } 106 return { fb: fb, tex: tex }; 107 } 108 109 gl.disable(gl.DEPTH_TEST); 110 111 var numFBOs = 32; 112 for (var ii = 0; ii < numFBOs; ++ii) { 113 createFBO(); 114 var t = createFBO(); 115 tex = t.tex; 116 fb = t.fb; 117 118 gl.bindFramebuffer(gl.FRAMEBUFFER, fb); 119 gl.scissor(0, 0, size, size); 120 gl.clearColor(0, ii / numFBOs, 1 - ii / numFBOs, 1); 121 gl.clear(gl.COLOR_BUFFER_BIT); 122 g_textures.push(tex); 123 } 124 125 gl.bindFramebuffer(gl.FRAMEBUFFER, null); 126 127 var vertexObject = gl.createBuffer(); 128 gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject); 129 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([ 130 -1,1,0, 1,1,0, -1,-1,0, 131 -1,-1,0, 1,1,0, 1,-1,0 132 ]), gl.STATIC_DRAW); 133 gl.enableVertexAttribArray(0); 134 gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0); 135 136 var vertexObject = gl.createBuffer(); 137 gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject); 138 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([ 139 0,0, 1,0, 0,1, 140 0,1, 1,0, 1,1 141 ]), gl.STATIC_DRAW); 142 gl.enableVertexAttribArray(1); 143 gl.vertexAttribPointer(1, 2, gl.FLOAT, false, 0, 0); 144 145 gl.bindTexture(gl.TEXTURE_2D, tex); 146 g_texLoc = gl.getUniformLocation(gl.program, "tex"); 147 gl.uniform1i(g_texLoc, 0); 148 g_worldLoc = gl.getUniformLocation(gl.program, "world"); 149 gl.uniformMatrix4fv(g_worldLoc, false, [ 150 0, 0, 0, 0, 151 0, 0, 0, 0, 152 0, 0, 1, 0, 153 0, 0, 0, 1]); 154 155 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); 156 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); 157 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 158 159 setInterval(render, 1000/60); 160 } 161 162 var g_angle = 0; 163 var g_texIndex = 0; 164 function render() { 165 g_angle += 0.1; 166 g_texIndex++; 167 if (g_texIndex >= g_textures.length) { 168 g_texIndex = 0; 169 } 170 gl.bindTexture(gl.TEXTURE_2D, g_textures[g_texIndex]); 171 gl.uniformMatrix4fv(g_worldLoc, false, rotationZ(g_angle)); 172 gl.clearColor(1,0,0,1); 173 gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); 174 gl.drawArrays(gl.TRIANGLES, 0, 6); 175 } 176 177 /** 178 * Creates a 4-by-4 matrix which rotates around the z-axis by the given angle. 179 * @param {number} angle The angle by which to rotate (in radians). 180 * @return {!o3djs.math.Matrix4} The rotation matrix. 181 */ 182 function rotationZ(angle) { 183 var c = Math.cos(angle); 184 var s = Math.sin(angle); 185 186 return [ 187 c, s, 0, 0, 188 -s, c, 0, 0, 189 0, 0, 1, 0, 190 0, 0, 0, 1 191 ]; 192 }; 193 194 debug(""); 195 var successfullyParsed = true; 196 </script> 197 <script> 198 "use strict"; 199 </script> 200 201 </body> 202 </html>