dom/canvas/test/webgl-conf/checkout/conformance2/textures/misc/angle-stuck-depth-textures.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 Textures Misc Tests: "Stuck" Depth Textures</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
  16 <script id="draw-vs" type="x-shader/x-vertex">#version 100
  17 attribute vec3 vertex;
  18 void main () {
  19   gl_Position = vec4(vertex.x, vertex.y, vertex.z * 2.0 - 1.0, 1);
  20 }
  21 </script>
  22 <script id="draw-fs" type="x-shader/x-fragment">#version 100
  23 void main () {
  24   gl_FragColor = vec4 (1.);
  25 }
  26 </script>
  27
  28 <script id="blit-vs" type="x-shader/x-vertex">#version 100
  29 attribute vec2 vertex;
  30 varying vec2 position;
  31 void main () {
  32   position = vertex * .5 + .5;
  33   gl_Position = vec4(vertex, 0, 1);
  34 }
  35 </script>
  36 <script id="blit-fs" type="x-shader/x-fragment">#version 100
  37 precision mediump float;
  38 uniform sampler2D texture;
  39 varying vec2 position;
  40 void main () {
  41   gl_FragColor = vec4 (texture2D (texture, position).rrr, 1.);
  42 }
  43 </script>
  44
  45 </head>
  46 <body>
  47 <canvas id="example" width="128" height="128"></canvas>
  48 <div id="description"></div>
  49 <div id="console"></div>
  50
  51 <script>
  52 "use strict";
  53
  54 description("This test covers an ANGLE bug where an AMD workaround would cause depth textures to stick. See http://anglebug.com/1664.");
  55
  56 var wtu = WebGLTestUtils;
  57 var gl = wtu.create3DContext("example", undefined, 2);
  58
  59 var WEBGL_depth_texture;
  60
  61 var drawProgram, blitProgram, textureLoc;
  62
  63 var quadVB;
  64
  65 function drawQuad(depth) {
  66   if (!quadVB) {
  67     quadVB = gl.createBuffer()
  68   }
  69
  70   var quadVerts = new Float32Array(3 * 6);
  71   quadVerts[0] = -1.0; quadVerts[1] =   1.0; quadVerts[2] = depth;
  72   quadVerts[3] = -1.0; quadVerts[4] =  -1.0; quadVerts[5] = depth;
  73   quadVerts[6] =  1.0; quadVerts[7] =  -1.0; quadVerts[8] = depth;
  74   quadVerts[9] = -1.0; quadVerts[10] =  1.0; quadVerts[11] = depth;
  75   quadVerts[12] = 1.0; quadVerts[13] = -1.0; quadVerts[14] = depth;
  76   quadVerts[15] = 1.0; quadVerts[16] =  1.0; quadVerts[17] = depth;
  77
  78   gl.bindBuffer(gl.ARRAY_BUFFER, quadVB);
  79   gl.bufferData(gl.ARRAY_BUFFER, quadVerts, gl.STATIC_DRAW);
  80   gl.vertexAttribPointer(0, 3, gl.FLOAT, gl.FALSE, 0, 0);
  81   gl.enableVertexAttribArray(0);
  82   gl.drawArrays(gl.TRIANGLES, 0, 6);
  83
  84   wtu.glErrorShouldBe(gl, gl.NO_ERROR, "after drawQuad");
  85 }
  86
  87 // Test based on dEQP-GLES3.functional.blit.depth_stencil.depth_24_stencil8_stencil_only
  88 function run_test() {
  89
  90   var colorTex = gl.createTexture();
  91   gl.bindTexture(gl.TEXTURE_2D, colorTex);
  92   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
  93   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
  94   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
  95   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
  96   gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, 128, 128, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
  97   gl.bindTexture(gl.TEXTURE_2D, null);
  98
  99   var depthTex = gl.createTexture();
 100   gl.bindTexture(gl.TEXTURE_2D, depthTex);
 101   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
 102   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
 103   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
 104   gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST_MIPMAP_NEAREST);
 105   var levels = Math.log2(128);
 106   for (var mipLevel = 0; mipLevel <= levels; ++mipLevel)
 107   {
 108       var size = 128 >> mipLevel;
 109       gl.texImage2D(gl.TEXTURE_2D, mipLevel, gl.DEPTH24_STENCIL8, size, size, 0, gl.DEPTH_STENCIL,
 110                     gl.UNSIGNED_INT_24_8, null);
 111   }
 112   gl.bindTexture(gl.TEXTURE_2D, null);
 113
 114   wtu.glErrorShouldBe(gl, gl.NO_ERROR, "after init textures");
 115
 116   var framebuffer = gl.createFramebuffer();
 117   gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
 118
 119   gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, colorTex, 0);
 120   gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.DEPTH_ATTACHMENT, gl.TEXTURE_2D, depthTex, 0);
 121
 122   wtu.glErrorShouldBe(gl, gl.NO_ERROR, "after init framebuffer");
 123
 124   gl.depthRange(0.0, 1.0);
 125   gl.viewport(0, 0, 128, 128);
 126   gl.clearColor(0, 0, 0, 1);
 127
 128   // Draw loop.
 129   for (var frame = 0; frame < 4; ++frame)
 130   {
 131       // draw into FBO
 132       gl.bindFramebuffer(gl.FRAMEBUFFER, framebuffer);
 133       gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT | gl.STENCIL_BUFFER_BIT);
 134
 135       gl.enable(gl.DEPTH_TEST);
 136
 137       gl.useProgram(drawProgram);
 138       if (frame % 2 != 0) {
 139         drawQuad(0.0);
 140       } else {
 141         drawQuad(1.0);
 142       }
 143
 144       gl.bindFramebuffer(gl.FRAMEBUFFER, null);
 145
 146       // blit FBO
 147       gl.disable(gl.DEPTH_TEST);
 148
 149       gl.useProgram(blitProgram);
 150       gl.uniform1i(textureLoc, 0);
 151       gl.bindTexture(gl.TEXTURE_2D, depthTex);
 152
 153       drawQuad(0.5);
 154
 155       if (frame % 2 != 0) {
 156         wtu.checkCanvasRect(gl, 0, 0, 128, 128, [0, 0, 0, 255],
 157                             "depth texture should be black on odd iterations");
 158
 159       } else {
 160         wtu.checkCanvasRect(gl, 0, 0, 128, 128, [255, 255, 255, 255],
 161                             "depth texture should be white on even iterations");
 162       }
 163
 164       wtu.glErrorShouldBe(gl, gl.NO_ERROR, "after draw");
 165   }
 166
 167   gl.deleteTexture(colorTex);
 168   gl.deleteTexture(depthTex);
 169   gl.deleteFramebuffer(framebuffer);
 170 }
 171
 172 if (!gl) {
 173     testFailed("WebGL context does not exist");
 174 } else {
 175     testPassed("WebGL context exists");
 176
 177     drawProgram = wtu.setupProgram(gl, ["draw-vs", "draw-fs"], ["vertex"]);
 178     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "after draw program initialization");
 179     shouldBe('gl.getProgramParameter(drawProgram, gl.LINK_STATUS)', 'true');
 180
 181     blitProgram = wtu.setupProgram(gl, ["blit-vs", "blit-fs"], ["vertex"]);
 182     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "after blit program initialization");
 183     shouldBe('gl.getProgramParameter(blitProgram, gl.LINK_STATUS)', 'true');
 184
 185     textureLoc = gl.getUniformLocation(blitProgram, "texture")
 186     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "query texture location");
 187     shouldBeNonNull('textureLoc')
 188
 189     run_test();
 190 }
 191
 192 var successfullyParsed = true;
 193 </script>
 194 <script src="../../../js/js-test-post.js"></script>
 195
 196 </body>
 197 </html>