summaryrefslogtreecommitdiffstats
path: root/dom/canvas/test/webgl-mochitest/test_hidden_alpha.html
blob: addc1b0162d6fd9dc840ab16a66f3f22ba13b346 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!DOCTYPE HTML>
<title>WebGL test: Hidden alpha on no-alpha contexts</title>
<script src='/tests/SimpleTest/SimpleTest.js'></script>
<link rel='stylesheet' href='/tests/SimpleTest/test.css'>
<script src='driver-info.js'></script>
<script src='webgl-util.js'></script>
<body>
<script id='vs' type='x-shader/x-vertex'>
  attribute vec2 aPosCoord;

  void main(void) {
    gl_Position = vec4(aPosCoord, 0.0, 1.0);
  }
</script>

<script id='fs' type='x-shader/x-fragment'>
  precision mediump float;

  void main(void) {
    gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
  }
</script>
<canvas id='canvas' style='border: none;' width='100' height='100'></canvas>
<script>

var posCoords_arr = new Float32Array(2 * 4);
var posCoords_buff = null;
function DrawQuad(gl, prog, x0, y0, x1, y1) {
  gl.useProgram(prog);

  if (!posCoords_buff) {
    posCoords_buff = gl.createBuffer();
  }
  gl.bindBuffer(gl.ARRAY_BUFFER, posCoords_buff);
  posCoords_arr[0] = x0;
  posCoords_arr[1] = y0;

  posCoords_arr[2] = x1;
  posCoords_arr[3] = y0;

  posCoords_arr[4] = x0;
  posCoords_arr[5] = y1;

  posCoords_arr[6] = x1;
  posCoords_arr[7] = y1;
  gl.bufferData(gl.ARRAY_BUFFER, posCoords_arr, gl.STREAM_DRAW);

  gl.enableVertexAttribArray(prog.aPosCoord);
  gl.vertexAttribPointer(prog.aPosCoord, 2, gl.FLOAT, false, 0, 0);

  gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4);
}

function DrawSquare(gl, prog, size) {
  DrawQuad(gl, prog, -size, -size, size, size);
}

function Reset(gl) {
  gl.canvas.width += 1;
  gl.canvas.width -= 1;
}

function ReadCenterPixel(gl) {
  var w = gl.drawingbufferWidth;
  var h = gl.drawingbufferHeight;
  var ret = new Uint8Array(4);
  gl.readPixels(w/2, h/2, 1, 1, gl.RGBA, gl.UNSIGNED_BYTE, ret);
  return ret;
}

function Test(gl, prog) {
  gl.enable(gl.BLEND);
  gl.blendFunc(gl.ZERO, gl.DST_ALPHA);

  var iColor = 64;
  var fColor = iColor / 255.0;

  //////////////////

  ok(true, 'clear(R,G,B,0)');

  Reset(gl);

  gl.clearColor(fColor, fColor, fColor, 0.0);
  gl.clear(gl.COLOR_BUFFER_BIT);

  var dataURL_pre = gl.canvas.toDataURL();
  //console.log('Before blending: ' + dataURL_pre);

  DrawSquare(gl, prog, 0.7);

  var pixel = ReadCenterPixel(gl);
  ok(pixel[0] == iColor &&
     pixel[1] == iColor &&
     pixel[2] == iColor, 'Color should be the same.');
  ok(pixel[3] == 255, 'No-alpha should always readback as 1.0 alpha.');

  var dataURL_post = gl.canvas.toDataURL();
  //console.log('After blending: ' + dataURL_post);
  ok(dataURL_post == dataURL_pre,
     'toDataURL should be unchanged after blending.');

  //////////////////

  ok(true, 'mask(R,G,B,0), clear(R,G,B,1)');

  Reset(gl);

  gl.colorMask(true, true, true, false);
  gl.clearColor(fColor, fColor, fColor, 1.0);
  gl.clear(gl.COLOR_BUFFER_BIT);
  gl.colorMask(true, true, true, true);

  dataURL_pre = gl.canvas.toDataURL();
  //console.log('Before blending: ' + dataURL_pre);

  DrawSquare(gl, prog, 0.7);

  var pixel = ReadCenterPixel(gl);
  ok(pixel[0] == iColor &&
     pixel[1] == iColor &&
     pixel[2] == iColor, 'Color should be the same.');
  ok(pixel[3] == 255, 'No-alpha should always readback as 1.0 alpha.');
  ok(gl.getError() == 0, 'Should have no errors.');

  dataURL_post = gl.canvas.toDataURL();
  //console.log('After blending: ' + dataURL_post);
  ok(dataURL_post == dataURL_pre,
     'toDataURL should be unchanged after blending.');

  ok(true, 'Test complete.');
  SimpleTest.finish();
}

(function(){
  var canvas = document.getElementById('canvas');
  var attribs = {
    alpha: false,
    antialias: false,
    premultipliedAlpha: false,
  };
  var gl = canvas.getContext('experimental-webgl', attribs);
  ok(gl, 'WebGL should work.');
  ok(gl.getParameter(gl.ALPHA_BITS) == 0, 'Shouldn\'t have alpha bits.');

  var prog = WebGLUtil.createProgramByIds(gl, 'vs', 'fs');
  ok(prog, 'Program should link.');
  prog.aPosCoord = gl.getAttribLocation(prog, 'aPosCoord');

  SimpleTest.waitForExplicitFinish();
  SimpleTest.requestFlakyTimeout("untriaged");
  setTimeout(function(){ Test(gl, prog); }, 500);
})();

</script>
</body>