|
1 <!-- |
|
2 Copyright (c) 2011 The Chromium Authors. All rights reserved. |
|
3 Use of this source code is governed by a BSD-style license that can be |
|
4 found in the LICENSE file. |
|
5 --> |
|
6 <!DOCTYPE html> |
|
7 <html> |
|
8 <head> |
|
9 <meta charset="utf-8"> |
|
10 <title>Test the WebGL premultipledAlpha context creation flag.</title> |
|
11 <link rel="stylesheet" href="../../resources/js-test-style.css"/> |
|
12 <script src="../../resources/js-test-pre.js"></script> |
|
13 <script src="../resources/webgl-test.js"> </script> |
|
14 <script src="../resources/webgl-test-utils.js"> </script> |
|
15 </head> |
|
16 <body> |
|
17 <div id="description"></div><div id="console"></div> |
|
18 <script> |
|
19 var wtu = WebGLTestUtils; |
|
20 |
|
21 var tests = [ |
|
22 // If premultipledAlpha is true then |
|
23 // [texture] [canvas] [dataURL] |
|
24 // 32, 64, 128, 128 -> 64, 128, 255, 128 -> 64, 128, 255, 128 |
|
25 { creationAttributes: {}, |
|
26 sentColor: [32, 64, 128, 128], |
|
27 expectedColor: [64, 128, 255, 128], |
|
28 errorRange: 2, |
|
29 imageFormat: "image/png" |
|
30 }, |
|
31 // If premultipledAlpha is true then |
|
32 // [texture] [canvas] [texture] |
|
33 // 32, 64, 128, 128 -> 64, 128, 255, 128 -> 64, 128, 255, 128 |
|
34 { creationAttributes: {}, |
|
35 sentColor: [32, 64, 128, 128], |
|
36 expectedColor: [64, 128, 255, 128], |
|
37 errorRange: 2, |
|
38 }, |
|
39 // If premultipledAlpha is false then |
|
40 // [texture] [canvas] [dataURL] |
|
41 // 255, 192, 128, 1 -> 255, 192, 128, 1 -> 255, 192, 128, 1 |
|
42 { creationAttributes: {premultipliedAlpha: false}, |
|
43 sentColor: [255, 192, 128, 1], |
|
44 expectedColor: [255, 192, 128, 1], |
|
45 errorRange: 0, |
|
46 imageFormat: "image/png" |
|
47 }, |
|
48 // If premultipledAlpha is false then |
|
49 // [texture] [canvas] [texture] |
|
50 // 255, 192, 128, 1 -> 255, 192, 128, 1 -> 255, 192, 128, 1 |
|
51 { creationAttributes: {premultipliedAlpha: false}, |
|
52 sentColor: [255, 192, 128, 1], |
|
53 expectedColor: [255, 192, 128, 1], |
|
54 errorRange: 0, |
|
55 }, |
|
56 // If premultipledAlpha is false then |
|
57 // [texture] [canvas] [dataURL] |
|
58 // 255, 255, 255, 128 -> 255, 255, 255, 128 -> 128, 128, 128, 255 |
|
59 { creationAttributes: {premultipliedAlpha: false}, |
|
60 sentColor: [255, 255, 255, 128], |
|
61 expectedColor: [128, 128, 128, 255], |
|
62 errorRange: 2, |
|
63 imageFormat: "image/jpeg" |
|
64 }, |
|
65 // If premultipledAlpha is true then |
|
66 // [texture] [canvas] [dataURL] |
|
67 // 128, 128, 128, 128 -> 255, 255, 255, 128 -> 128, 128, 128, 255 |
|
68 { creationAttributes: {}, |
|
69 sentColor: [128, 128, 128, 128], |
|
70 expectedColor: [128, 128, 128, 255], |
|
71 errorRange: 2, |
|
72 imageFormat: "image/jpeg" |
|
73 } |
|
74 ]; |
|
75 |
|
76 var g_count = 0; |
|
77 var gl; |
|
78 var canvas; |
|
79 var premultipledAlpha; |
|
80 |
|
81 description("Test the WebGL premultipledAlpha context creation flag."); |
|
82 doNextTest(); |
|
83 function doNextTest() { |
|
84 if (g_count < tests.length) { |
|
85 var test = tests[g_count++]; |
|
86 canvas = document.createElement("canvas"); |
|
87 // Need to preserve drawing buffer to load it in a callback |
|
88 test.creationAttributes.preserveDrawingBuffer = true; |
|
89 gl = wtu.create3DContext(canvas, test.creationAttributes); |
|
90 var premultipliedAlpha = test.creationAttributes.premultipliedAlpha != false; |
|
91 debug("") |
|
92 debug("testing: premultipliedAlpha: " + premultipliedAlpha + " imageFormat: " + test.imageFormat); |
|
93 |
|
94 shouldBe('gl.getContextAttributes().premultipledAlpha', 'premultipledAlpha'); |
|
95 shouldBeTrue('gl.getContextAttributes().preserveDrawingBuffer'); |
|
96 |
|
97 console.log(gl.getContextAttributes()); |
|
98 var program = wtu.setupTexturedQuad(gl); |
|
99 |
|
100 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from setup."); |
|
101 var tex = gl.createTexture(); |
|
102 wtu.fillTexture(gl, tex, 2, 2, test.sentColor, 0); |
|
103 var loc = gl.getUniformLocation(program, "tex"); |
|
104 gl.uniform1i(loc, 0); |
|
105 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); |
|
106 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); |
|
107 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); |
|
108 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); |
|
109 |
|
110 wtu.drawQuad(gl); |
|
111 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from drawing."); |
|
112 |
|
113 function loadTexture() { |
|
114 var pngTex = gl.createTexture(); |
|
115 // not needed as it's the default |
|
116 // gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, false); |
|
117 gl.pixelStorei(gl.UNPACK_COLORSPACE_CONVERSION_WEBGL, false); |
|
118 gl.bindTexture(gl.TEXTURE_2D, pngTex); |
|
119 if (test.imageFormat) { |
|
120 // create texture from image |
|
121 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, this); |
|
122 } else { |
|
123 // create texture from canvas |
|
124 gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, canvas); |
|
125 } |
|
126 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); |
|
127 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); |
|
128 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE); |
|
129 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE); |
|
130 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from creating copy."); |
|
131 wtu.drawQuad(gl); |
|
132 glErrorShouldBe(gl, gl.NO_ERROR, "Should be no errors from 2nd drawing."); |
|
133 wtu.checkCanvas( |
|
134 gl, test.expectedColor, |
|
135 "should draw with " + test.expectedColor, test.errorRange); |
|
136 |
|
137 doNextTest(); |
|
138 } |
|
139 |
|
140 if (test.imageFormat) { |
|
141 // Load canvas into string using toDataURL |
|
142 var imageUrl = canvas.toDataURL(test.imageFormat); |
|
143 if (test.imageFormat != "image/png" && |
|
144 (imageUrl.indexOf("data:image/png,") == 0 || |
|
145 imageUrl.indexOf("data:image/png;") == 0)) { |
|
146 debug("Image format " + test.imageFormat + " not supported; skipping"); |
|
147 setTimeout(doNextTest, 0); |
|
148 } else { |
|
149 // Load string into the texture |
|
150 var input = document.createElement("img"); |
|
151 input.onload = loadTexture; |
|
152 input.src = imageUrl; |
|
153 } |
|
154 } else { |
|
155 // Load canvas into the texture asynchronously (to prevent unbounded stack consumption) |
|
156 setTimeout(loadTexture, 0); |
|
157 } |
|
158 } else { |
|
159 successfullyParsed = true; |
|
160 finishTest(); |
|
161 } |
|
162 } |
|
163 |
|
164 </script> |
|
165 |
|
166 </body> |
|
167 </html> |
|
168 |
|
169 |