dom/canvas/test/webgl-conf/checkout/conformance/rendering/point-size.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 <link rel="stylesheet" href="../../resources/js-test-style.css"/>
  12 <script src="../../js/js-test-pre.js"></script>
  13 <script src="../../js/webgl-test-utils.js"></script>
  14 <script id="vshader" type="x-shader/x-vertex">
  15 attribute vec3 pos;
  16 attribute vec4 colorIn;
  17 uniform float pointSize;
  18 varying vec4 color;
  19
  20 void main()
  21 {
  22     gl_PointSize = pointSize;
  23     color = colorIn;
  24     gl_Position = vec4(pos, 1.0);
  25 }
  26 </script>
  27
  28 <script id="fshader" type="x-shader/x-fragment">
  29 precision mediump float;
  30 varying vec4 color;
  31
  32 void main()
  33 {
  34     gl_FragColor = color;
  35 }
  36 </script>
  37 </head>
  38 <body>
  39 <canvas id="testbed" width="2" height="2"></canvas>
  40 <div id="description"></div>
  41 <div id="console"></div>
  42 <script>
  43 "use strict";
  44 description('Verify GL_VERTEX_PROGRAM_POINT_SIZE is enabled in WebGL');
  45
  46 var wtu = WebGLTestUtils;
  47 var gl = wtu.create3DContext('testbed', { antialias: false });
  48 shouldBeNonNull("gl");
  49
  50 gl.disable(gl.BLEND);
  51
  52 // The choice of (0.4, 0.4) ensures that the centers of the surrounding
  53 // pixels are not contained within the point when it is of size 1, but
  54 // that they definitely are when it is of size 2.
  55 var vertices = new Float32Array([
  56     0.4, 0.4, 0.0]);
  57 var colors = new Uint8Array([
  58     255, 0, 0, 255]);
  59
  60 var colorOffset = vertices.byteLength;
  61
  62 var buf = new Uint8Array(2 * 2 * 4);
  63 var index = 0;
  64
  65 var vbo = gl.createBuffer();
  66 gl.bindBuffer(gl.ARRAY_BUFFER, vbo);
  67 gl.bufferData(gl.ARRAY_BUFFER, colorOffset + colors.byteLength, gl.STATIC_DRAW);
  68 gl.bufferSubData(gl.ARRAY_BUFFER, 0, vertices);
  69 gl.bufferSubData(gl.ARRAY_BUFFER, colorOffset, colors);
  70
  71 function test(program) {
  72     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  73
  74     gl.vertexAttribPointer(0, 3, gl.FLOAT, false, 0, 0);
  75     gl.enableVertexAttribArray(0);
  76     gl.vertexAttribPointer(1, 4, gl.UNSIGNED_BYTE, true, 0, colorOffset);
  77     gl.enableVertexAttribArray(1);
  78
  79     var locPointSize = gl.getUniformLocation(program, 'pointSize');
  80
  81     shouldBe('gl.getError()', 'gl.NO_ERROR');
  82
  83     debug('Draw a point of size 1 and verify it does not touch any other pixels.');
  84
  85     gl.uniform1f(locPointSize, 1.0);
  86     gl.drawArrays(gl.POINTS, 0, vertices.length / 3);
  87
  88     shouldBe('gl.getError()', 'gl.NO_ERROR');
  89
  90     for (var y = 0; y < 2; ++y) {
  91         for (var x = 0; x < 2; ++x) {
  92             var correctColor = (x == 1 && y == 1) ? [255, 0, 0] : [0, 0, 0];
  93             wtu.checkCanvasRect(gl, x, y, 1, 1, correctColor);
  94         }
  95     }
  96     gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
  97
  98     debug('Draw a point of size 2 and verify it fills the appropriate region.');
  99
 100     var pointSizeRange = gl.getParameter(gl.ALIASED_POINT_SIZE_RANGE);
 101     if (pointSizeRange[1] >= 2.0) {
 102         gl.uniform1f(locPointSize, 2.0);
 103         gl.drawArrays(gl.POINTS, 0, vertices.length / 3);
 104         shouldBe('gl.getError()', 'gl.NO_ERROR');
 105         wtu.checkCanvasRect(gl, 0, 0, 2, 2, [255, 0, 0]);
 106     }
 107 }
 108
 109 debug('');
 110 debug('Pass 1');
 111 var program1 = wtu.setupProgram(gl, ['vshader', 'fshader'], ['pos', 'colorIn']);
 112 shouldBe('gl.getError()', 'gl.NO_ERROR');
 113 test(program1);
 114
 115 // Under some versions of ANGLE point sprite shader programs were
 116 // incorrectly reloaded from cache. Rebuilding the shader program and
 117 // repeating the test simulates the conditions that caused it to fail
 118 debug('');
 119 debug('Pass 2');
 120 var program2 = wtu.setupProgram(gl, ['vshader', 'fshader'], ['pos', 'colorIn']);
 121 shouldBe('gl.getError()', 'gl.NO_ERROR');
 122 test(program2);
 123
 124 var successfullyParsed = true;
 125 </script>
 126 <script src="../../js/js-test-post.js"></script>
 127
 128 </body>
 129 </html>