canvas-resizing-with-pbo-bound.html (3015B)
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 2 Resizing With PBO Bound 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="canvas1" style="width: 256px; height: 256px;"> </canvas> 19 <canvas id="canvas2" style="width: 256px; height: 256px;"> </canvas> 20 <div id="console"></div> 21 <script> 22 "use strict"; 23 24 description("Verifies that resizing the canvas (recreating the backing framebuffer) works correctly while a PBO is bound."); 25 26 debug(""); 27 debug("Regression test for Chromium <a href='https://bugs.chromium.org/p/chromium/issues/detail?id=644572'>Issue 644572</a>"); 28 debug(""); 29 30 var wtu = WebGLTestUtils; 31 var canvas; 32 var largeSize = 256; 33 var smallSize = 128; 34 var currentSize; 35 var gl; 36 var numFrames = 0; 37 var testNumber = 0; 38 var pbo; 39 40 function nextTest() { 41 ++testNumber; 42 numFrames = 0; 43 currentSize = largeSize; 44 if (testNumber > 2) { 45 finishTest(); 46 return; 47 } 48 49 canvas = document.getElementById("canvas" + testNumber); 50 canvas.width = currentSize; 51 canvas.height = currentSize; 52 var usePreserveDrawingBuffer = (testNumber == 1) ? true : false; 53 debug("Testing preserveDrawingBuffer = " + usePreserveDrawingBuffer); 54 gl = wtu.create3DContext(canvas, { preserveDrawingBuffer: usePreserveDrawingBuffer }, 2); 55 56 if (!gl) { 57 testFailed("context does not exist"); 58 59 wtu.requestAnimFrame(nextTest); 60 } else { 61 testPassed("context exists"); 62 63 gl.clearColor(0, 1, 0, 1); 64 65 pbo = gl.createBuffer(); 66 gl.bindBuffer(gl.PIXEL_UNPACK_BUFFER, pbo); 67 68 wtu.requestAnimFrame(render); 69 } 70 } 71 72 function render() { 73 if (++numFrames < 4) { 74 if (currentSize == largeSize) { 75 canvas.height = smallSize; 76 currentSize = smallSize; 77 } else { 78 canvas.height = largeSize; 79 currentSize = largeSize; 80 } 81 } 82 83 gl.viewport(0, 0, largeSize, currentSize); 84 gl.clear(gl.COLOR_BUFFER_BIT); 85 86 // Check the four corners 87 var green = [ 0, 255, 0, 255 ]; 88 var inset = 3; 89 wtu.checkCanvasRect(gl, inset, inset, 1, 1, green, "lower left should be green", 1); 90 wtu.checkCanvasRect(gl, largeSize - inset, inset, 1, 1, green, "lower right should be green", 1); 91 wtu.checkCanvasRect(gl, inset, currentSize - inset, 1, 1, green, "upper left should be green", 1); 92 wtu.checkCanvasRect(gl, largeSize - inset, currentSize - inset, 1, 1, green, "upper right should be green", 1); 93 94 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "No GL error"); 95 if (gl.getParameter(gl.PIXEL_UNPACK_BUFFER_BINDING) != pbo) { 96 testFailed("Pixel unpack buffer binding was lost"); 97 } 98 99 if (numFrames < 4) { 100 wtu.requestAnimFrame(render); 101 } else { 102 wtu.requestAnimFrame(nextTest); 103 } 104 } 105 106 wtu.requestAnimFrame(nextTest); 107 108 </script> 109 110 </body> 111 </html>