LayoutTests/webgl/resources/webgl_test_files/conformance2/vertex_arrays/vertex-array-object-and-disabled-attributes.html - WebKit - Git at Google

 <!--
 Copyright (c) 2019 The Khronos Group Inc.
 Use of this source code is governed by an MIT-style license that can be
 found in the LICENSE.txt file.
 -->

 <!DOCTYPE html>
 <html>
 <head>
 <meta charset="utf-8">
 <title>WebGL 2 Disabled Vertex Array Object and Disabled Attributes Test</title>
 <link rel="stylesheet" href="../../resources/js-test-style.css"/>
 <script src="../../js/js-test-pre.js"></script>
 <script src="../../js/webgl-test-utils.js"> </script>
 </head>
 <body>
 <canvas id="example" width="50" height="50">
 </canvas>
 <div id="description"></div>
 <div id="console"></div>
 <script id="singlevshader" type="x-shader/x-vertex">
 attribute vec4 position;
 void main() {
   gl_Position = position;
 }
 </script>

 <script id="singlefshader" type="x-shader/x-fragment">
 void main() {
   gl_FragColor = vec4(1, 0, 0, 1);
 }
 </script>
 <script id="dualvshader" type="x-shader/x-vertex">#version 300 es
 in vec4 position;
 in vec4 color;
 out vec4 varyColor;
 void main() {
   gl_Position = position;
   varyColor = color;
 }
 </script>
 <script id="dualfshader" type="x-shader/x-fragment">#version 300 es
 precision mediump float;
 in vec4 varyColor;
 out vec4 colorOut;
 void main() {
   colorOut = varyColor;
 }
 </script>

 <script>
 // Test that switching VAOs keeps the disabled "current value" attributes up-to-date.
 // Based on ANGLE test (StateChangeTestES3, VertexArrayObjectAndDisabledAttributes) from https://github.com/google/angle/blob/f7f0b8c3ab21c52cc2915048959361cf628d95f0/src/tests/gl_tests/StateChangeTest.cpp
 "use strict";
 var wtu = WebGLTestUtils;
 description();

 var gl = wtu.create3DContext("example", undefined, 2);

 // Location of "position" attribute must match between shaders.
 var singleProgram = wtu.setupProgram(gl, ['singlevshader', 'singlefshader'], ['position'], [0]);
 var dualProgram = wtu.setupProgram(gl, ['dualvshader', 'dualfshader'], ['position'], [0]);

 var positionLocation = gl.getAttribLocation(dualProgram, "position");
 var colorLocation = gl.getAttribLocation(dualProgram, "color");
 var singlePositionLocation = gl.getAttribLocation(singleProgram, "position");


 gl.useProgram(singleProgram);

 var positions = new Float32Array([
     -1, 1,
     -1, -1,
     1, -1,
     -1, 1,
     1, -1,
     1, 1
 ]);

 var positionBuffer = gl.createBuffer();
 gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
 gl.bufferData(gl.ARRAY_BUFFER, positions, gl.STATIC_DRAW);

 var vertexArray = gl.createVertexArray();
 gl.bindVertexArray(vertexArray);

 gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
 gl.vertexAttribPointer(singlePositionLocation, 2, gl.FLOAT, false, 0, 0);
 gl.enableVertexAttribArray(singlePositionLocation);

 gl.drawArrays(gl.TRIANGLES, 0, 6);
 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
 wtu.checkCanvas(gl, [255, 0, 0, 255], "should be red");

 gl.bindVertexArray(null);
 gl.useProgram(dualProgram);
 gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0);
 gl.enableVertexAttribArray(positionLocation);

 var greenBuffer = gl.createBuffer();
 var green = new Uint8Array(4 * 6);

 for (var i = 0; i < 6; ++i) {
   var ci = i * 4;

   green[ci] = 0;
   green[ci + 1] = 255;
   green[ci + 2] = 0;
   green[ci + 3] = 255;
 }

 gl.bindBuffer(gl.ARRAY_BUFFER, greenBuffer);
 gl.bufferData(gl.ARRAY_BUFFER, green, gl.STATIC_DRAW);
 gl.vertexAttribPointer(colorLocation, 4, gl.UNSIGNED_BYTE, true, 0, 0);
 gl.enableVertexAttribArray(colorLocation);

 gl.drawArrays(gl.TRIANGLES, 0, 6);
 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
 wtu.checkCanvas(gl, [0, 255, 0, 255], "should be green");

 gl.bindVertexArray(vertexArray);
 gl.drawArrays(gl.TRIANGLES, 0, 6);
 wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
 wtu.checkCanvas(gl, [0, 0, 0, 255], "should be black");

 var successfullyParsed = true;
 </script>
 <script src="../../js/js-test-post.js"></script>

 </body>
 </html>
	<!--
	Copyright (c) 2019 The Khronos Group Inc.
	Use of this source code is governed by an MIT-style license that can be
	found in the LICENSE.txt file.
	-->

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>WebGL 2 Disabled Vertex Array Object and Disabled Attributes Test</title>
	<link rel="stylesheet" href="../../resources/js-test-style.css"/>
	<script src="../../js/js-test-pre.js"></script>
	<script src="../../js/webgl-test-utils.js"> </script>
	</head>
	<body>
	<canvas id="example" width="50" height="50">
	</canvas>
	<div id="description"></div>
	<div id="console"></div>
	<script id="singlevshader" type="x-shader/x-vertex">
	attribute vec4 position;
	void main() {
	gl_Position = position;
	}
	</script>

	<script id="singlefshader" type="x-shader/x-fragment">
	void main() {
	gl_FragColor = vec4(1, 0, 0, 1);
	}
	</script>
	<script id="dualvshader" type="x-shader/x-vertex">#version 300 es
	in vec4 position;
	in vec4 color;
	out vec4 varyColor;
	void main() {
	gl_Position = position;
	varyColor = color;
	}
	</script>
	<script id="dualfshader" type="x-shader/x-fragment">#version 300 es
	precision mediump float;
	in vec4 varyColor;
	out vec4 colorOut;
	void main() {
	colorOut = varyColor;
	}
	</script>

	<script>
	// Test that switching VAOs keeps the disabled "current value" attributes up-to-date.
	// Based on ANGLE test (StateChangeTestES3, VertexArrayObjectAndDisabledAttributes) from https://github.com/google/angle/blob/f7f0b8c3ab21c52cc2915048959361cf628d95f0/src/tests/gl_tests/StateChangeTest.cpp
	"use strict";
	var wtu = WebGLTestUtils;
	description();

	var gl = wtu.create3DContext("example", undefined, 2);

	// Location of "position" attribute must match between shaders.
	var singleProgram = wtu.setupProgram(gl, ['singlevshader', 'singlefshader'], ['position'], [0]);
	var dualProgram = wtu.setupProgram(gl, ['dualvshader', 'dualfshader'], ['position'], [0]);

	var positionLocation = gl.getAttribLocation(dualProgram, "position");
	var colorLocation = gl.getAttribLocation(dualProgram, "color");
	var singlePositionLocation = gl.getAttribLocation(singleProgram, "position");


	gl.useProgram(singleProgram);

	var positions = new Float32Array([
	-1, 1,
	-1, -1,
	1, -1,
	-1, 1,
	1, -1,
	1, 1
	]);

	var positionBuffer = gl.createBuffer();
	gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
	gl.bufferData(gl.ARRAY_BUFFER, positions, gl.STATIC_DRAW);

	var vertexArray = gl.createVertexArray();
	gl.bindVertexArray(vertexArray);

	gl.bindBuffer(gl.ARRAY_BUFFER, positionBuffer);
	gl.vertexAttribPointer(singlePositionLocation, 2, gl.FLOAT, false, 0, 0);
	gl.enableVertexAttribArray(singlePositionLocation);

	gl.drawArrays(gl.TRIANGLES, 0, 6);
	wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
	wtu.checkCanvas(gl, [255, 0, 0, 255], "should be red");

	gl.bindVertexArray(null);
	gl.useProgram(dualProgram);
	gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0);
	gl.enableVertexAttribArray(positionLocation);

	var greenBuffer = gl.createBuffer();
	var green = new Uint8Array(4 * 6);

	for (var i = 0; i < 6; ++i) {
	var ci = i * 4;

	green[ci] = 0;
	green[ci + 1] = 255;
	green[ci + 2] = 0;
	green[ci + 3] = 255;
	}

	gl.bindBuffer(gl.ARRAY_BUFFER, greenBuffer);
	gl.bufferData(gl.ARRAY_BUFFER, green, gl.STATIC_DRAW);
	gl.vertexAttribPointer(colorLocation, 4, gl.UNSIGNED_BYTE, true, 0, 0);
	gl.enableVertexAttribArray(colorLocation);

	gl.drawArrays(gl.TRIANGLES, 0, 6);
	wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
	wtu.checkCanvas(gl, [0, 255, 0, 255], "should be green");

	gl.bindVertexArray(vertexArray);
	gl.drawArrays(gl.TRIANGLES, 0, 6);
	wtu.glErrorShouldBe(gl, gl.NO_ERROR, "should be no errors");
	wtu.checkCanvas(gl, [0, 0, 0, 255], "should be black");

	var successfullyParsed = true;
	</script>
	<script src="../../js/js-test-post.js"></script>

	</body>
	</html>