Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / content / test / data / gpu / pixel_webgl.html
blob68fab9e8b3fb43a248815944671bfa81abe80b96
1 <!DOCTYPE HTML>
3 <!-- READ BEFORE UPDATING:
4 If this test is updated make sure to increment the "revision" value of the
5 associated test in content/test/gpu/page_sets/pixel_tests.py. This will ensure
6 that the baseline images are regenerated on the next run.
7 -->
9 <html>
10 <head>
11 <title>WebGL Test: Green Triangle over Black Background</title>
12 <style type="text/css">
13 .nomargin {
14 margin: 0px auto;
16 </style>
18 <script id="shader-vs" type="x-shader/x-vertex">
19 attribute vec3 pos;
20 void main(void)
22 gl_Position = vec4(pos, 1.0);
24 </script>
26 <script id="shader-fs" type="x-shader/x-fragment">
27 precision mediump float;
28 void main(void)
30 gl_FragColor = vec4(0.0, 1.0, 0.0, 1.0);
32 </script>
34 <script>
35 var g_swapsBeforeAck = 15;
36 var gl;
38 function main()
40 var canvas = document.getElementById("c");
41 gl = initGL(canvas);
42 if (gl && setup(gl)) {
43 drawSomeFrames();
44 } else {
45 domAutomationController.setAutomationId(1);
46 domAutomationController.send("FAILURE");
50 function drawSomeFrames()
52 if (g_swapsBeforeAck == 0) {
53 domAutomationController.setAutomationId(1);
54 domAutomationController.send("SUCCESS");
55 } else {
56 g_swapsBeforeAck--;
57 draw(gl);
58 window.webkitRequestAnimationFrame(drawSomeFrames);
62 function initGL(canvas)
64 var gl = null;
65 try {
66 gl = canvas.getContext("experimental-webgl");
67 } catch (e) {}
68 if (!gl) {
69 try {
70 gl = canvas.getContext("webgl");
71 } catch (e) { }
73 return gl;
76 function setupShader(gl, source, type) {
77 var shader = gl.createShader(type);
78 gl.shaderSource(shader, source);
79 gl.compileShader(shader);
80 if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS))
81 return null;
82 return shader;
85 function setupProgram(gl, vs_id, fs_id) {
86 var vs_node = document.getElementById(vs_id);
87 var fs_node = document.getElementById(fs_id);
88 if (!vs_node || !fs_node)
89 return null;
90 var vs = setupShader(gl, vs_node.text, gl.VERTEX_SHADER);
91 var fs = setupShader(gl, fs_node.text, gl.FRAGMENT_SHADER);
92 if (!vs || !fs)
93 return null;
94 var program = gl.createProgram();
95 gl.attachShader(program, vs);
96 gl.attachShader(program, fs);
97 gl.linkProgram(program);
98 if (!gl.getProgramParameter(program, gl.LINK_STATUS))
99 return null;
100 gl.useProgram(program);
101 return program;
104 function setupBuffer(gl) {
105 var buffer = gl.createBuffer();
106 gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
107 var vertexData = [
108 0.0, 0.6, 0.0, // Vertex 1 position
109 -0.6, -0.6, 0.0, // Vertex 2 position
110 0.6, -0.6, 0.0, // Vertex 3 position
112 gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertexData), gl.STATIC_DRAW);
115 function setup(gl) {
116 var program = setupProgram(gl, "shader-vs", "shader-fs");
117 if (!program)
118 return false;
119 var posAttr = gl.getAttribLocation(program, "pos");
120 gl.enableVertexAttribArray(posAttr);
121 setupBuffer(gl);
122 var stride = 3 * Float32Array.BYTES_PER_ELEMENT;
123 gl.vertexAttribPointer(posAttr, 3, gl.FLOAT, false, stride, 0);
124 gl.clearColor(0.0, 0.0, 0.0, 0.0);
125 gl.viewport(0, 0, 200, 200);
126 gl.disable(gl.DEPTH_TEST);
127 if (gl.getError() != gl.NO_ERROR)
128 return false;
129 return true;
132 function draw(gl) {
133 gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
134 gl.drawArrays(gl.TRIANGLES, 0, 3);
136 </script>
137 </head>
138 <body onload="main()">
139 <div style="position:relative; width:200px; height:200px; background-color:black"></div>
140 <div style="position:absolute; top:0px; left:0px">
141 <canvas id="c" width="200" height="200" class="nomargin"></canvas>
142 </div>
143 </body>
144 </html>