dom/canvas/test/webgl-conf/checkout/conformance/rendering/point-specific-shader-variables.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>Point-specific shader variables 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="c" width="64" height="64"></canvas>
  18 <div id="description"></div>
  19 <div id="console"></div>
  20
  21 <script id="vs-assign" type="x-shader/x-vertex">
  22 attribute vec2 aPosition;
  23
  24 varying vec2 vPos;
  25
  26 void main()
  27 {
  28     gl_Position = vec4(aPosition, 0, 1);
  29     vPos = aPosition;
  30
  31     gl_PointSize = 1.0;
  32 }
  33 </script>
  34
  35 <script id="vs-conditional" type="x-shader/x-vertex">
  36 uniform float renderingPoints; // not assigned, equal to 0.0
  37 attribute vec2 aPosition;
  38
  39 varying vec2 vPos;
  40
  41 void main()
  42 {
  43     gl_Position = vec4(aPosition, 0, 1);
  44     vPos = aPosition;
  45
  46     if (renderingPoints > 0.0) {
  47         gl_PointSize = 1.0;
  48     }
  49 }
  50 </script>
  51
  52 <script id="fs-overwrite" type="x-shader/x-fragment">
  53 varying mediump vec2 vPos;
  54
  55 void main()
  56 {
  57     gl_FragColor = vec4(gl_PointCoord.xy, 0, 1);
  58     gl_FragColor = vec4(vPos * -2.0, 0, 1);
  59 }
  60 </script>
  61
  62 <script id="fs-unused-branch" type="x-shader/x-fragment">
  63 varying mediump vec2 vPos;
  64 uniform mediump float uDefaultsToZero;
  65
  66 void main()
  67 {
  68     gl_FragColor = vec4(vPos * -2.0, 0, 1);
  69     if (uDefaultsToZero == 1.0) {
  70         gl_FragColor = vec4(gl_PointCoord.xy, 0, 1);
  71     }
  72 }
  73 </script>
  74
  75 <script>
  76 "use strict";
  77 description(document.title);
  78
  79 debug('This test verifies rendering with programs referencing shader variables specific to rendering of POINTS primitives.');
  80
  81 var wtu = WebGLTestUtils;
  82 var gl = wtu.create3DContext("c", {depth: false});
  83
  84 var prog_overwrite = wtu.setupProgram(gl, ["vs-assign", "fs-overwrite"], ["aPosition"]);
  85 var prog_branch = wtu.setupProgram(gl, ["vs-assign", "fs-unused-branch"], ["aPosition"]);
  86 var prog_cond_overwrite = wtu.setupProgram(gl, ["vs-conditional", "fs-overwrite"], ["aPosition"]);
  87 var prog_cond_branch = wtu.setupProgram(gl, ["vs-conditional", "fs-unused-branch"], ["aPosition"]);
  88
  89 var vertData = new Float32Array([
  90     -1, -1,
  91     +1, -1,
  92     -1, +1,
  93 ]);
  94
  95 var vertexObject = gl.createBuffer();
  96 gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject);
  97 gl.bufferData(gl.ARRAY_BUFFER, vertData, gl.STATIC_DRAW);
  98
  99 gl.enableVertexAttribArray(0);
 100 gl.vertexAttribPointer(0, 2, gl.FLOAT, false, 0, 0);
 101
 102 //////////
 103
 104 debug("");
 105 debug("prog-overwrite");
 106
 107 gl.clear(gl.COLOR_BUFFER_BIT);
 108 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [0, 0, 0, 0]); // Bottom-left
 109
 110 gl.useProgram(prog_overwrite);
 111 gl.drawArrays(gl.TRIANGLES, 0, 3);
 112
 113 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [255, 255, 0, 255]); // Bottom-left
 114 wtu.checkCanvasRect(gl, 63, 63, 1, 1, [0, 0, 0, 0]); // Top-right
 115
 116
 117 //////////
 118
 119 debug("");
 120 debug("prog-branch");
 121
 122 gl.clear(gl.COLOR_BUFFER_BIT);
 123 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [0, 0, 0, 0]); // Bottom-left
 124
 125 gl.useProgram(prog_branch);
 126 gl.drawArrays(gl.TRIANGLES, 0, 3);
 127
 128 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [255, 255, 0, 255]); // Bottom-left
 129 wtu.checkCanvasRect(gl, 63, 63, 1, 1, [0, 0, 0, 0]); // Top-right
 130
 131 //////////
 132
 133 debug("");
 134 debug("prog-cond-overwrite");
 135
 136 gl.clear(gl.COLOR_BUFFER_BIT);
 137 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [0, 0, 0, 0]); // Bottom-left
 138
 139 gl.useProgram(prog_cond_overwrite);
 140 gl.drawArrays(gl.TRIANGLES, 0, 3);
 141
 142 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [255, 255, 0, 255]); // Bottom-left
 143 wtu.checkCanvasRect(gl, 63, 63, 1, 1, [0, 0, 0, 0]); // Top-right
 144
 145
 146 //////////
 147
 148 debug("");
 149 debug("prog-cond-branch");
 150
 151 gl.clear(gl.COLOR_BUFFER_BIT);
 152 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [0, 0, 0, 0]); // Bottom-left
 153
 154 gl.useProgram(prog_cond_branch);
 155 gl.drawArrays(gl.TRIANGLES, 0, 3);
 156
 157 wtu.checkCanvasRect(gl, 0, 0, 1, 1, [255, 255, 0, 255]); // Bottom-left
 158 wtu.checkCanvasRect(gl, 63, 63, 1, 1, [0, 0, 0, 0]); // Top-right
 159
 160 var successfullyParsed = true;
 161 </script>
 162
 163 <script src="../../js/js-test-post.js"></script>
 164
 165 </body>
 166 </html>