Regression(iOS 13) web views do not deal properly with their window's UIScene changing
[WebKit-https.git] / LayoutTests / fast / canvas / webgl / texImage2DImageDataTest.html
1 <!DOCTYPE html>
2 <html>
3   <head>
4     <title>texImage2D ImageData Test</title>
5     <script src="resources/webgl-test.js"> </script>
6     <script id="vshader" type="x-shader/x-vertex">
7         attribute vec3 vPosition;
8         attribute vec2 vTexCoord0;
9         varying vec2 texCoord;
10         void main()
11         {
12             gl_Position = vec4(vPosition.x, vPosition.y, vPosition.z, 1.0);
13             texCoord = vTexCoord0;
14         }
15     </script>
16
17     <script id="fshader" type="x-shader/x-fragment">
18         #ifdef GL_ES
19         precision highp float;
20         #endif
21         uniform sampler2D tex;
22         varying vec2 texCoord;
23         void main()
24         {
25             gl_FragColor = texture2D(tex, texCoord);
26         }
27     </script>
28
29     <script>
30         function fail(x,y, buf, shouldBe)
31         {
32             var i = (y*64+x) * 4;
33             var reason = "pixel at ("+x+","+y+") is ("+buf[i]+","+buf[i+1]+","+buf[i+2]+","+buf[i+3]+"), should be "+shouldBe;
34             document.getElementById("results").innerHTML = "Test <span style='color:red'>FAILED</span> "+reason;
35         }
36         
37         function pass()
38         {
39             document.getElementById("results").innerHTML = "Test <span style='color:green'>PASSED</span>";
40         }
41         
42         function checkGLError()
43         {
44             var error = gl.getError();
45             if (error != gl.NO_ERROR) {
46                 var str = "GL Error: " + error;
47                 document.body.appendChild(document.createTextNode(str));
48                 throw str;
49             }
50         }
51         
52         function init()
53         {
54             if (window.testRunner)
55                 testRunner.dumpAsText();
56             // Set up a canvas to get image data from
57             var canvas2d = document.getElementById("texcanvas");
58             var context2d = canvas2d.getContext("2d");
59             context2d.fillStyle = 'red';
60             context2d.fillRect(0,0,64,64);
61                         
62             gl = initWebGL("example", "vshader", "fshader", [ "vPosition", "vTexCoord0"], [ 1, 0, 1, 1 ], 100);
63             gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
64             
65             var vertexObject = gl.createBuffer();
66             gl.bindBuffer(gl.ARRAY_BUFFER, vertexObject);
67             var vertices = new Float32Array([
68                 -1,  1, 0,
69                 -1, -1, 0,
70                  1,  1, 0,
71                  1, -1, 0,
72                  1,  1, 0,
73                 -1, -1, 0]);
74             var texCoords = new Float32Array([
75                  0, 1,
76                  0, 0,
77                  1, 1,
78                  1, 0,
79                  1, 1,
80                  0, 0]);
81             g_texCoordOffset = vertices.byteLength;
82             gl.bufferData(gl.ARRAY_BUFFER, g_texCoordOffset + texCoords.byteLength, gl.STATIC_DRAW);
83             gl.bufferSubData(gl.ARRAY_BUFFER, 0, vertices);
84             gl.bufferSubData(gl.ARRAY_BUFFER, g_texCoordOffset, texCoords);
85             
86             gl.enableVertexAttribArray(0);
87             gl.vertexAttribPointer(0, 3, gl.FLOAT, gl.FALSE, 0, 0);
88             gl.enableVertexAttribArray(1);
89             gl.vertexAttribPointer(1, 2, gl.FLOAT, gl.FALSE, 0, g_texCoordOffset);
90
91             // Create a texture from the canvas's image data
92             var tex = gl.createTexture();
93             gl.bindTexture(gl.TEXTURE_2D, tex);
94             gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, context2d.getImageData(0, 0, 64, 64));
95             gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
96             gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
97             gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.NEAREST);
98             gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.NEAREST);
99             
100             g_textureLoc = gl.getUniformLocation(gl.program, "tex");
101             gl.uniform1i(g_textureLoc, 0);
102             
103             gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
104             gl.drawArrays(gl.TRIANGLES, 0, 6);
105             
106             checkGLError();
107
108             // Test several locations
109             // Each line should be all red 
110             var buf = new Uint8Array(64 * 64 * 4);
111             gl.readPixels(0, 0, 64, 64, gl.RGBA, gl.UNSIGNED_BYTE, buf);
112             
113             var offset15 = 3840; // (15*64) * 4
114             var offset40 = 10240; // (40*64) * 4
115             var offset63 = 16128; // (63*64) * 4
116             for (var i = 0; i < 64; ++i) {
117                 var test0 = (buf[i*4] != 255 || buf[i*4+1] != 0 || buf[i*4+2] != 0 || buf[i*4+3] != 255);
118                 var test15 = (buf[offset15+i*4] != 255 || buf[offset15+i*4+1] != 0 || buf[offset15+i*4+2] != 0 || buf[offset15+i*4+3] != 255);
119                 var test40 = (buf[offset40+i*4] != 255 || buf[offset40+i*4+1] != 0 || buf[offset40+i*4+2] != 0 || buf[offset40+i*4+3] != 255);
120                 var test63 = (buf[offset63+i*4] != 255 || buf[offset63+i*4+1] != 0 || buf[offset63+i*4+2] != 0 || buf[offset63+i*4+3] != 255);
121                 if (test0) {
122                     fail(i, 0, buf, "(255,0,0,255)");
123                     return;
124                 }
125                 if (test15) {
126                     fail(i, 15, buf, "(255,0,0,255)");
127                     return;
128                 }
129                 if (test40) {
130                     fail(i, 40, buf, "(255,0,0,255)");
131                     return;
132                 }
133                 if (test63) {
134                     fail(i, 63, buf, "(255,0,0,255)");
135                     return;
136                 }
137             }
138             pass();
139        }
140     </script>
141   </head>
142   <body onload="init()">
143     <canvas id="texcanvas" width="64px" height="64px"></canvas>
144     <canvas id="example" width="64px" height="64px">
145     There is supposed to be an example drawing here, but it's not important.
146     </canvas>
147     <div id="results">Test <span style="color:red">FAILED</span></div>
148   </body>
149 </html>