large-uniform-buffers.html (4396B)
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 large uniform buffers conformance 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 <script id="vshader" type="x-shader/x-vertex">#version 300 es 16 in vec4 a_vertex; 17 void main(void) { 18 gl_Position = a_vertex; 19 } 20 </script> 21 <script id="fshader" type="x-shader/x-fragment">#version 300 es 22 precision mediump float; 23 layout (std140) uniform color_ubo { 24 vec4 color; 25 }; 26 out vec4 fragColor; 27 void main(void) { 28 fragColor = color; 29 } 30 </script> 31 </head> 32 <body> 33 <canvas id="example" width="100", height="100"></canvas> 34 <div id="description"></div> 35 <div id="console"></div> 36 <script> 37 "use strict"; 38 debug(""); 39 description("Test for UBOs sized over 65536 - https://bugs.chromium.org/p/angleproject/issues/detail?id=3388"); 40 41 var wtu = WebGLTestUtils; 42 var gl = wtu.create3DContext("example", undefined, 2); 43 44 function runTest() { 45 var program = wtu.setupProgram(gl, ['vshader', 'fshader'], ['a_vertex']); 46 var uboIndex = gl.INVALID_INDEX; 47 if (program) 48 uboIndex = gl.getUniformBlockIndex(program, "color_ubo"); 49 if (!program || uboIndex == gl.INVALID_INDEX) { 50 testFailed("Loading program failed"); 51 return; 52 } 53 testPassed("Loading program succeeded"); 54 55 var vertices = new Float32Array([ 56 -1, -1, 0, 57 1, -1, 0, 58 -1, 1, 0, 59 1, 1, 0 60 ]); 61 var vertexBuf = gl.createBuffer(); 62 gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuf); 63 gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW); 64 gl.enableVertexAttribArray(0); 65 gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0); 66 67 var indexBuf = gl.createBuffer(); 68 gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, indexBuf); 69 gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Int16Array([ 0, 1, 2, 2, 1, 3 ]), gl.STATIC_DRAW); 70 71 var uboDataSize = gl.getActiveUniformBlockParameter( 72 program, uboIndex, gl.UNIFORM_BLOCK_DATA_SIZE); 73 if (uboDataSize == 0) { 74 testFailed("uniform block data size invalid"); 75 return; 76 } 77 78 var uboBuf = gl.createBuffer(); 79 var uboData = new Float32Array(0x20000); 80 81 var offs0 = 0x00000; 82 // Red 83 uboData[offs0 + 0] = 1; 84 uboData[offs0 + 1] = 0; 85 uboData[offs0 + 2] = 0; 86 uboData[offs0 + 3] = 1; 87 88 var offs1 = 0x10000; 89 const alignment = gl.getParameter(gl.UNIFORM_BUFFER_OFFSET_ALIGNMENT); 90 if (offs1 % alignment != 0) 91 testFailed("Platform has a strange uniform buffer offset alignment requirement: " + alignment); 92 93 // Green 94 uboData[offs1 + 0] = 0; 95 uboData[offs1 + 1] = 1; 96 uboData[offs1 + 2] = 0; 97 uboData[offs1 + 3] = 1; 98 99 gl.uniformBlockBinding(program, uboIndex, 0); 100 gl.bindBufferBase(gl.UNIFORM_BUFFER, 0, uboBuf); 101 gl.bufferData(gl.UNIFORM_BUFFER, uboData, gl.STATIC_DRAW); 102 103 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "No errors from setup"); 104 105 debug("draw lower triangle - should be red"); 106 gl.bindBufferRange(gl.UNIFORM_BUFFER, 0, uboBuf, offs0 * 4, 0x10); 107 gl.drawElements(gl.TRIANGLES, 3, gl.UNSIGNED_SHORT, 0); 108 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "No errors from draw"); 109 110 debug("draw upper triangle - should be green"); 111 var uboBuf2 = gl.createBuffer(); 112 gl.bindBufferRange(gl.UNIFORM_BUFFER, 0, uboBuf, offs1 * 4, 0x10); 113 gl.drawElements(gl.TRIANGLES, 3, gl.UNSIGNED_SHORT, 6); 114 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "No errors from draw"); 115 116 var width = 100, height = 100; 117 wtu.checkCanvasRectColor(gl, 0, 0, width/2-5, height/2-5, [255, 0, 0, 255], 2, 118 function() { testPassed("lower left should be red"); }, 119 function() { testFailed("lower left should be red"); }); 120 wtu.checkCanvasRectColor(gl, width/2+5, height/2+5, width/2-5, height/2-5, [0, 255, 0, 255], 2, 121 function() { testPassed("top right should be green"); }, 122 function() { testFailed("top right should be green"); }); 123 } 124 125 if (!gl) { 126 testFailed("WebGL context creation failed"); 127 } else { 128 testPassed("WebGL context creation succeeded"); 129 runTest(); 130 } 131 132 debug(""); 133 var successfullyParsed = true; 134 </script> 135 <script src="../../js/js-test-post.js"></script> 136 137 </body> 138 </html>