dom/canvas/test/webgl-conf/checkout/conformance/rendering/framebuffer-switch.html

   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 framebuffer switching 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 <canvas id="canvas" width="64" height="64"></canvas>
  18 <div id="description"></div>
  19 <div id="console"></div>
  20 <script>
  21 "use strict";
  22 description("Test framebuffer switching. The test switches between two framebuffers, copying rendering results from one to the other.");
  23 var wtu = WebGLTestUtils;
  24 var canvas = document.getElementById("canvas");
  25
  26 var gl = wtu.create3DContext("canvas");
  27 var program = wtu.setupTexturedQuad(gl);
  28
  29 var tex1 = gl.createTexture();
  30 gl.bindTexture(gl.TEXTURE_2D, tex1);
  31 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, canvas.width, canvas.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  32 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
  33 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
  34 var fb1 = gl.createFramebuffer();
  35 gl.bindFramebuffer(gl.FRAMEBUFFER, fb1);
  36 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex1, 0);
  37
  38 var tex2 = gl.createTexture();
  39 gl.bindTexture(gl.TEXTURE_2D, tex2);
  40 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, canvas.width, canvas.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  41 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
  42 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
  43 var fb2 = gl.createFramebuffer();
  44 gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  45 gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, tex2, 0);
  46
  47 gl.bindTexture(gl.TEXTURE_2D, tex1);
  48 gl.clearColor(1.0, 1.0, 1.0, 1.0);
  49
  50 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup.");
  51
  52 var iterate = function(checkFBOs, iterations) {
  53     for (var i = 0; i < iterations; ++i) {
  54         debug("Clearing framebuffer 1 to white");
  55         gl.bindFramebuffer(gl.FRAMEBUFFER, fb1);
  56         if (checkFBOs)
  57             shouldBe("gl.checkFramebufferStatus(gl.FRAMEBUFFER)", "gl.FRAMEBUFFER_COMPLETE");
  58         gl.clear(gl.COLOR_BUFFER_BIT);
  59
  60         debug("Copying framebuffer 1 to framebuffer 2");
  61         gl.bindFramebuffer(gl.FRAMEBUFFER, fb2);
  62         if (checkFBOs)
  63             shouldBe("gl.checkFramebufferStatus(gl.FRAMEBUFFER)", "gl.FRAMEBUFFER_COMPLETE");
  64         gl.drawArrays(gl.TRIANGLES, 0, 6);
  65     }
  66     // Read what is in fb2
  67     wtu.checkCanvas(gl, [255,255,255,255], "Framebuffer 2 should be white");
  68 };
  69
  70 debug("");
  71 debug("Warm-up iteration");
  72 iterate(true, 1);
  73
  74 debug("");
  75 debug("Iterating the test a few times since at least one bug it has exposed is somewhat flaky.");
  76 for (var i = 0; i < 3; ++i) {
  77     debug("");
  78     debug("Iteration " + (i + 1));
  79     iterate(false, 2);
  80 }
  81
  82 debug("");
  83 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors at the end of the test.");
  84
  85 finishTest();
  86
  87 var successfullyParsed = true;
  88 </script>
  89 </body>
  90 </html>
  91