dom/canvas/test/webgl-conf/checkout/conformance/extensions/ext-polygon-offset-clamp.html

   1 <!--
   2 Copyright (c) 2023 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 EXT_polygon_offset_clamp 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 </head>
  16 <body>
  17 <canvas width="32" height="32" id="c"></canvas>
  18 <div id="description"></div>
  19 <div id="console"></div>
  20 <script>
  21 "use strict";
  22 description("This test verifies the functionality of the EXT_polygon_offset_clamp extension, if it is available.");
  23
  24 debug("");
  25
  26 var wtu = WebGLTestUtils;
  27 var gl = wtu.create3DContext();
  28 var ext;
  29 const w = gl.drawingBufferWidth;
  30 const h = gl.drawingBufferHeight;
  31
  32 function runTestNoExtension() {
  33     debug("");
  34     debug("Check the parameter without the extension");
  35     shouldBeNull("gl.getParameter(0x8E1B /* POLYGON_OFFSET_CLAMP_EXT */)");
  36     wtu.glErrorShouldBe(gl, gl.INVALID_ENUM, "parameter unknown without enabling the extension");
  37     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
  38 }
  39
  40 function checkEnums() {
  41     debug("");
  42     debug("Check enums");
  43     shouldBe("ext.POLYGON_OFFSET_CLAMP_EXT", "0x8E1B");
  44 }
  45
  46 function checkQueries() {
  47     debug("");
  48     debug("Check default state");
  49     shouldBe('gl.getParameter(gl.POLYGON_OFFSET_FACTOR)', '0.0');
  50     shouldBe('gl.getParameter(gl.POLYGON_OFFSET_UNITS)', '0.0');
  51     shouldBe('gl.getParameter(ext.POLYGON_OFFSET_CLAMP_EXT)', '0.0');
  52     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
  53     debug("");
  54     debug("Check state update using the new function");
  55     ext.polygonOffsetClampEXT(1.0, 2.0, 3.0);
  56     shouldBe('gl.getParameter(gl.POLYGON_OFFSET_FACTOR)', '1.0');
  57     shouldBe('gl.getParameter(gl.POLYGON_OFFSET_UNITS)', '2.0');
  58     shouldBe('gl.getParameter(ext.POLYGON_OFFSET_CLAMP_EXT)', '3.0');
  59     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
  60     debug("");
  61     debug("Check that the unextended function resets the clamp value to zero");
  62     gl.polygonOffset(4.0, 5.0);
  63     shouldBe('gl.getParameter(gl.POLYGON_OFFSET_FACTOR)', '4.0');
  64     shouldBe('gl.getParameter(gl.POLYGON_OFFSET_UNITS)', '5.0');
  65     shouldBe('gl.getParameter(ext.POLYGON_OFFSET_CLAMP_EXT)', '0.0');
  66     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
  67 }
  68
  69 function checkClamping() {
  70     debug("");
  71     debug("Check polygon offset clamp operation");
  72
  73     // The shader creates a depth slope from left (0) to right (1).
  74     //
  75     // This test issues two draw calls:
  76     //
  77     //           Draw 2 (green): factor width, offset 0, clamp 0.5, depth test: Greater
  78     //          ^     |       __________________
  79     //          |     |    __/      __/
  80     //          |     V __/      __/  <--- Draw 1 (red): factor width, offset 0, clamp 0.25
  81     //          |    __/      __/
  82     //          | __/      __/
  83     //          |/      __/
  84     //          |    __/
  85     //          | __/
  86     //          |/
  87     //          |
  88     //          |
  89     //          +------------------------------->
  90     //
  91     // Result:  <---------green--------><--red-->
  92
  93
  94     const program = wtu.setupProgram(gl, [wtu.simpleVertexShader,
  95                                           wtu.simpleColorFragmentShader]);
  96     gl.useProgram(program);
  97     const colorLoc = gl.getUniformLocation(program, "u_color");
  98
  99     const buf = gl.createBuffer();
 100     gl.bindBuffer(gl.ARRAY_BUFFER, buf);
 101     gl.bufferData(
 102         gl.ARRAY_BUFFER,
 103         new Float32Array([-1, -1, -1, 1, -1, 1, -1, 1, -1, 1, 1, 1]),
 104         gl.STATIC_DRAW);
 105     gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
 106     gl.enableVertexAttribArray(0);
 107
 108     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
 109
 110     gl.enable(gl.POLYGON_OFFSET_FILL);
 111     gl.clearColor(0, 0, 0, 1);
 112     gl.clearDepth(0);
 113     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
 114
 115     gl.enable(gl.DEPTH_TEST);
 116
 117     gl.depthFunc(gl.ALWAYS);
 118     gl.uniform4f(colorLoc, 1, 0, 0, 1);
 119     ext.polygonOffsetClampEXT(w, 0, 0.25);
 120     gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
 121
 122     gl.depthFunc(gl.GREATER);
 123     gl.uniform4f(colorLoc, 0, 1, 0, 1);
 124     ext.polygonOffsetClampEXT(w, 0, 0.5);
 125     gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
 126
 127     wtu.checkCanvasRect(
 128         gl,
 129         0, 0, 3 * w / 4 - 1, h,
 130         [0, 255, 0, 255], "should be green");
 131
 132     wtu.checkCanvasRect(
 133         gl,
 134         3 * w / 4 + 1, 0, w / 4 - 1, h,
 135         [255, 0, 0, 255], "should be red");
 136
 137     wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
 138 }
 139
 140 function runTestExtension() {
 141     checkEnums();
 142     checkQueries();
 143     checkClamping();
 144 }
 145
 146 function runTest() {
 147     if (!gl) {
 148         testFailed("WebGL context does not exist");
 149         return;
 150     }
 151     testPassed("WebGL context exists");
 152
 153     runTestNoExtension();
 154
 155     ext = gl.getExtension("EXT_polygon_offset_clamp");
 156
 157     wtu.runExtensionSupportedTest(gl, "EXT_polygon_offset_clamp", ext !== null);
 158
 159     if (ext !== null) {
 160         runTestExtension();
 161     } else {
 162         testPassed("No EXT_polygon_offset_clamp support -- this is legal");
 163     }
 164 }
 165
 166 runTest();
 167
 168 var successfullyParsed = true;
 169 </script>
 170 <script src="../../js/js-test-post.js"></script>
 171 </body>
 172 </html>