Bug 782860 - Add basic WebGL reftests - r=bjacob
BIN
content/canvas/test/reftest/black.png
Normal file
After Width: | Height: | Size: 1.0 KiB |
BIN
content/canvas/test/reftest/colors-half-alpha.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
content/canvas/test/reftest/colors.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
content/canvas/test/reftest/green.png
Normal file
After Width: | Height: | Size: 1.3 KiB |
BIN
content/canvas/test/reftest/half-colors-half-alpha.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
content/canvas/test/reftest/half-colors.png
Normal file
After Width: | Height: | Size: 1.8 KiB |
187
content/canvas/test/reftest/reftest.list
Normal file
@ -0,0 +1,187 @@
|
||||
# WebGL Reftests!
|
||||
# If you add new tests, don't forget to add sanity (&nogl) tests! (if needed)
|
||||
|
||||
# Check that disabling works:
|
||||
== webgl-disable-test.html?nogl wrapper.html?green.png
|
||||
pref(webgl.disabled,true) == webgl-disable-test.html wrapper.html?green.png
|
||||
|
||||
# Basic WebGL tests:
|
||||
# Do we get pixels to the screen at all?
|
||||
# Try to just hit the different rendering paths here.
|
||||
# Test: {aa, alpha, preserve, readback} = 16
|
||||
== webgl-clear-test.html?nogl wrapper.html?green.png
|
||||
|
||||
== webgl-clear-test.html?__&_____&________ wrapper.html?green.png
|
||||
== webgl-clear-test.html?aa&_____&________ wrapper.html?green.png
|
||||
== webgl-clear-test.html?__&alpha&________ wrapper.html?green.png
|
||||
== webgl-clear-test.html?aa&alpha&________ wrapper.html?green.png
|
||||
== webgl-clear-test.html?__&_____&preserve wrapper.html?green.png
|
||||
== webgl-clear-test.html?aa&_____&preserve wrapper.html?green.png
|
||||
== webgl-clear-test.html?__&alpha&preserve wrapper.html?green.png
|
||||
== webgl-clear-test.html?aa&alpha&preserve wrapper.html?green.png
|
||||
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&__&_____&________ wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&aa&_____&________ wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&__&alpha&________ wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&aa&alpha&________ wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&__&_____&preserve wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&aa&_____&preserve wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&__&alpha&preserve wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-clear-test.html?readback&aa&alpha&preserve wrapper.html?green.png
|
||||
|
||||
# Check orientation:
|
||||
== webgl-orientation-test.html?nogl wrapper.html?white-top-left.png
|
||||
|
||||
== webgl-orientation-test.html?__&_____&________ wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?aa&_____&________ wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?__&alpha&________ wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?aa&alpha&________ wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?__&_____&preserve wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?aa&_____&preserve wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?__&alpha&preserve wrapper.html?white-top-left.png
|
||||
== webgl-orientation-test.html?aa&alpha&preserve wrapper.html?white-top-left.png
|
||||
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&__&_____&________ wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&aa&_____&________ wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&__&alpha&________ wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&aa&alpha&________ wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&__&_____&preserve wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&aa&_____&preserve wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&__&alpha&preserve wrapper.html?white-top-left.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-orientation-test.html?readback&aa&alpha&preserve wrapper.html?white-top-left.png
|
||||
|
||||
# Does we draw the correct color in the correct places with all context creation options?
|
||||
# (Note that our context creation option matrix is 2^6 = 64)
|
||||
== webgl-color-test.html?nogl wrapper.html?colors.png
|
||||
|
||||
== webgl-color-test.html?__&_____&_____&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&_______&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&_____&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&premult&________&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&premult&________&_______ wrapper.html?colors.png
|
||||
|
||||
== webgl-color-test.html?__&_____&_____&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&_______&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&_____&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&premult&preserve&_______ wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&premult&preserve&_______ wrapper.html?colors.png
|
||||
|
||||
== webgl-color-test.html?__&_____&_____&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&_______&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&_____&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&premult&________&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&premult&________&stencil wrapper.html?colors.png
|
||||
|
||||
== webgl-color-test.html?__&_____&_____&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&_______&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&_____&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&_____&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&_____&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&_____&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&_____&depth&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&_____&depth&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?__&alpha&depth&premult&preserve&stencil wrapper.html?colors.png
|
||||
== webgl-color-test.html?aa&alpha&depth&premult&preserve&stencil wrapper.html?colors.png
|
||||
|
||||
|
||||
# Check a smaller selection for readback:
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&__&_____&________ wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&aa&_____&________ wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&__&alpha&________ wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&aa&alpha&________ wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&__&_____&preserve wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&aa&_____&preserve wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&__&alpha&preserve wrapper.html?colors.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-color-test.html?readback&aa&alpha&preserve wrapper.html?colors.png
|
||||
|
||||
|
||||
# Check alpha behavior:
|
||||
== webgl-color-alpha-test.html?colorVal=1.0&alphaVal=1.0&nogl wrapper.html?colors.png
|
||||
== webgl-color-alpha-test.html?colorVal=1.0&alphaVal=1.0 wrapper.html?colors.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=0.5&alphaVal=1.0&nogl wrapper.html?half-colors.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=0.5&alphaVal=1.0 wrapper.html?half-colors.png
|
||||
== webgl-color-alpha-test.html?colorVal=0.0&alphaVal=1.0&nogl wrapper.html?black.png
|
||||
== webgl-color-alpha-test.html?colorVal=0.0&alphaVal=1.0 wrapper.html?black.png
|
||||
|
||||
== webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.0&nogl wrapper.html?colors.png
|
||||
== webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.0 wrapper.html?colors.png
|
||||
== webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.0&alpha&nogl wrapper.html?white.png
|
||||
== webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.0&alpha wrapper.html?white.png
|
||||
|
||||
# Test premult:
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.5&alpha&nogl wrapper.html?colors-half-alpha.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.5&alpha wrapper.html?colors-half-alpha.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=0.5&alphaVal=0.5&alpha&nogl wrapper.html?half-colors-half-alpha.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=0.5&alphaVal=0.5&alpha wrapper.html?half-colors-half-alpha.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=0.5&alphaVal=0.5&alpha&premult&nogl wrapper.html?colors-half-alpha.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=0.5&alphaVal=0.5&alpha&premult wrapper.html?colors-half-alpha.png
|
||||
|
||||
# Test over-bright premult:
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.5&alpha&premult&nogl wrapper.html?colors-half-alpha.png
|
||||
fuzzy(1,65536) == webgl-color-alpha-test.html?colorVal=1.0&alphaVal=0.5&alpha&premult wrapper.html?colors-half-alpha.png
|
||||
|
||||
|
||||
# Check for hanging framebuffer bindings:
|
||||
== webgl-hanging-fb-test.html?nogl wrapper.html?green.png
|
||||
|
||||
== webgl-hanging-fb-test.html wrapper.html?green.png
|
||||
== webgl-hanging-fb-test.html?aa wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-hanging-fb-test.html?readback wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-hanging-fb-test.html?readback&aa wrapper.html?green.png
|
||||
|
||||
== webgl-hanging-scissor-test.html wrapper.html?green.png
|
||||
== webgl-hanging-scissor-test.html?aa wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-hanging-scissor-test.html?readback wrapper.html?green.png
|
||||
pref(webgl.force-layers-readback,true) == webgl-hanging-scissor-test.html?readback&aa wrapper.html?green.png
|
||||
|
||||
|
||||
# Check that our experimental prefs still work:
|
||||
|
||||
# 16bpp:
|
||||
pref(webgl.prefer-16bpp,true) == webgl-color-test.html?16bpp wrapper.html?colors.png
|
||||
pref(webgl.prefer-16bpp,true) pref(webgl.force-layers-readback,true) == webgl-color-test.html?16bpp&readback wrapper.html?colors.png
|
||||
|
||||
# Force native GL (Windows):
|
||||
skip-if(!winWidget) pref(webgl.prefer-native-gl,true) == webgl-clear-test.html?native-gl wrapper.html?green.png
|
||||
skip-if(!winWidget) pref(webgl.prefer-native-gl,true) == webgl-orientation-test.html?native-gl wrapper.html?white-top-left.png
|
||||
skip-if(!winWidget) pref(webgl.prefer-native-gl,true) == webgl-color-test.html?native-gl wrapper.html?colors.png
|
||||
skip-if(!winWidget) pref(webgl.prefer-native-gl,true) pref(webgl.prefer-16bpp,true) == webgl-color-test.html?native-gl&16bpp wrapper.html?colors.png
|
43
content/canvas/test/reftest/webgl-clear-test.html
Normal file
@ -0,0 +1,43 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Clear Test
|
||||
*
|
||||
* Clear the canvas to green to test that we get pixels to the screen.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl) {
|
||||
gl.clearColor(0.0, 1.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas) {
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(0, 255, 0, 1.0)";
|
||||
context.fillRect(0, 0, 256, 256);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
if (gl)
|
||||
renderGL(gl);
|
||||
else
|
||||
renderBackup(canvas);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
96
content/canvas/test/reftest/webgl-color-alpha-test.html
Normal file
@ -0,0 +1,96 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Color-Alpha Test
|
||||
*
|
||||
* Clear the four quadrants of the canvas as follows:
|
||||
* +------+------+
|
||||
* | red |green |
|
||||
* | | |
|
||||
* +------+------+
|
||||
* | blue |white |
|
||||
* | | |
|
||||
* +------+------+
|
||||
* However, unlike the Color test, clear with a given alpha value.
|
||||
* What effect this has depends on the context-creation args passed
|
||||
* to this page.
|
||||
*
|
||||
* Here we check that we handle various combinations of alpha and
|
||||
* premultipliedAlpha correctly.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl, value, alpha) {
|
||||
gl.enable(gl.SCISSOR_TEST);
|
||||
|
||||
gl.scissor(0, 128, 128, 128);
|
||||
gl.clearColor(value, 0.0, 0.0, alpha);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.scissor(128, 128, 128, 128);
|
||||
gl.clearColor(0.0, value, 0.0, alpha);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.scissor(0, 0, 128, 128);
|
||||
gl.clearColor(0.0, 0.0, value, alpha);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.scissor(128, 0, 128, 128);
|
||||
gl.clearColor(value, value, value, alpha);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas, value, alpha) {
|
||||
if (!arg("alpha"))
|
||||
alpha = 1.0;
|
||||
|
||||
if (arg("alpha") && arg("premult")) {
|
||||
if (alpha == 0.0)
|
||||
value = 1.0;
|
||||
else
|
||||
value /= alpha;
|
||||
}
|
||||
|
||||
var intValue = (value * 255) | 0;
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(" + intValue + ", 0, 0, " + alpha + ")";
|
||||
context.fillRect(0, 0, 128, 128);
|
||||
|
||||
context.fillStyle = "rgba(0, " + intValue + ", 0, " + alpha + ")";
|
||||
context.fillRect(128, 0, 128, 128);
|
||||
|
||||
context.fillStyle = "rgba(0, 0, " + intValue + ", " + alpha + ")";
|
||||
context.fillRect(0, 128, 128, 128);
|
||||
|
||||
context.fillStyle = "rgba(" + intValue + ", " + intValue + ", " + intValue + ", " + alpha + ")";
|
||||
context.fillRect(128, 128, 128, 128);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
var value = arg("colorVal");
|
||||
var alpha = arg("alphaVal");
|
||||
|
||||
if (gl)
|
||||
renderGL(gl, value, alpha);
|
||||
else
|
||||
renderBackup(canvas, value, alpha);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
80
content/canvas/test/reftest/webgl-color-test.html
Normal file
@ -0,0 +1,80 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Color Test
|
||||
*
|
||||
* Clear the four quadrants of the canvas as follows:
|
||||
* +------+------+
|
||||
* | red |green |
|
||||
* | | |
|
||||
* +------+------+
|
||||
* | blue |white |
|
||||
* | | |
|
||||
* +------+------+
|
||||
*
|
||||
* This is for checking that we're getting the right colors when
|
||||
* we ask for them. This combined with the Orientation test assure
|
||||
* that we are getting the correct colors in the correct places.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl) {
|
||||
gl.enable(gl.SCISSOR_TEST);
|
||||
|
||||
gl.scissor(0, 128, 128, 128);
|
||||
gl.clearColor(1.0, 0.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.scissor(128, 128, 128, 128);
|
||||
gl.clearColor(0.0, 1.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.scissor(0, 0, 128, 128);
|
||||
gl.clearColor(0.0, 0.0, 1.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.scissor(128, 0, 128, 128);
|
||||
gl.clearColor(1.0, 1.0, 1.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas) {
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(255, 0, 0, 1.0)";
|
||||
context.fillRect(0, 0, 128, 128);
|
||||
|
||||
context.fillStyle = "rgba(0, 255, 0, 1.0)";
|
||||
context.fillRect(128, 0, 128, 128);
|
||||
|
||||
context.fillStyle = "rgba(0, 0, 255, 1.0)";
|
||||
context.fillRect(0, 128, 128, 128);
|
||||
|
||||
context.fillStyle = "rgba(255, 255, 255, 1.0)";
|
||||
context.fillRect(128, 128, 128, 128);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
if (gl)
|
||||
renderGL(gl);
|
||||
else
|
||||
renderBackup(canvas);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
55
content/canvas/test/reftest/webgl-disable-test.html
Normal file
@ -0,0 +1,55 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Disable Test
|
||||
*
|
||||
* If we succeed in getting a WebGL context, we will fill
|
||||
* the canvas with red. If we fail to acquire a WebGL context,
|
||||
* we will use Canvas2D to instead fill it with green.
|
||||
*
|
||||
* Note that this test differs from the others in that
|
||||
* it will draw differently if it receives a WebGL context.
|
||||
* Other tests are designed to fallback silently to Canvas2D.
|
||||
*
|
||||
* We use this test to assure that when we disable WebGL,
|
||||
* WebGL does not function. This is trivially true for systems
|
||||
* that don't support WebGL. This test is not viable for testing
|
||||
* that WebGL works, as blocklisted systems will always draw green.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl) {
|
||||
gl.clearColor(1.0, 0.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas) {
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(0, 255, 0, 1.0)";
|
||||
context.fillRect(0, 0, 256, 256);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
if (gl)
|
||||
renderGL(gl);
|
||||
else
|
||||
renderBackup(canvas);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
53
content/canvas/test/reftest/webgl-hanging-fb-test.html
Normal file
@ -0,0 +1,53 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Hanging Framebuffer Test
|
||||
*
|
||||
* Clear the canvas to green, but create and bind a new framebuffer
|
||||
* before returning. This will fail if we blindly read from the bound
|
||||
* framebuffer, instead of binding to the screen and reading from that.
|
||||
*
|
||||
* How failure looks isn't well defined, since this is an empty framebuffer,
|
||||
* thus is incomplete, and should cause errors if it's read from.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl) {
|
||||
gl.clearColor(0.0, 1.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
var fb = gl.createFramebuffer();
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);
|
||||
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas) {
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(0, 255, 0, 1.0)";
|
||||
context.fillRect(0, 0, 256, 256);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
if (gl)
|
||||
renderGL(gl);
|
||||
else
|
||||
renderBackup(canvas);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
52
content/canvas/test/reftest/webgl-hanging-scissor-test.html
Normal file
@ -0,0 +1,52 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Hanging Scissor Test
|
||||
*
|
||||
* Clear the canvas to green, but create and enable and set scissor values
|
||||
* before returning. This can fail if we blindly blit or read from the screen
|
||||
* without disabling scissor-test.
|
||||
*
|
||||
* Failure should look like only the top-left quadrant is rendered.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl) {
|
||||
gl.clearColor(0.0, 1.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.enable(gl.SCISSOR_TEST);
|
||||
gl.scissor(0, 128, 128, 128);
|
||||
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas) {
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(0, 255, 0, 1.0)";
|
||||
context.fillRect(0, 0, 256, 256);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
if (gl)
|
||||
renderGL(gl);
|
||||
else
|
||||
renderBackup(canvas);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
55
content/canvas/test/reftest/webgl-orientation-test.html
Normal file
@ -0,0 +1,55 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
|
||||
<script type="text/javascript" src="webgl-utils.js"></script>
|
||||
<script type="text/javascript">
|
||||
/* Orientation Test
|
||||
*
|
||||
* Clear the canvas to black, and clear the upper-left quadrant
|
||||
* to white. If this doesn't pass, but the Clear test does, then
|
||||
* likely y-flip is wrong.
|
||||
*/
|
||||
|
||||
"use strict";
|
||||
|
||||
function renderGL(gl) {
|
||||
gl.clearColor(0.0, 0.0, 0.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.enable(gl.SCISSOR_TEST);
|
||||
gl.scissor(0, 128, 128, 128);
|
||||
gl.clearColor(1.0, 1.0, 1.0, 1.0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.finish();
|
||||
}
|
||||
|
||||
function renderBackup(canvas) {
|
||||
var context = canvas.getContext("2d");
|
||||
context.fillStyle = "rgba(0, 0, 0, 1.0)";
|
||||
context.fillRect(0, 0, 256, 256);
|
||||
|
||||
context.fillStyle = "rgba(255, 255, 255, 1.0)";
|
||||
context.fillRect(0, 0, 128, 128);
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
var canvas = document.getElementById("canvas");
|
||||
var gl = initGL(canvas);
|
||||
|
||||
if (gl)
|
||||
renderGL(gl);
|
||||
else
|
||||
renderBackup(canvas);
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body onload="onLoad();">
|
||||
<canvas id="canvas" width="256" height="256"></canvas>
|
||||
</body>
|
||||
|
||||
</html>
|
63
content/canvas/test/reftest/webgl-utils.js
Normal file
@ -0,0 +1,63 @@
|
||||
"use strict";
|
||||
|
||||
function parseArgs() {
|
||||
var query = window.location.search.substring(1);
|
||||
|
||||
var split = query.split("&");
|
||||
|
||||
var args = {}
|
||||
for (var i = 0; i < split.length; i++) {
|
||||
var pair = split[i].split("=");
|
||||
|
||||
var key = pair[0];
|
||||
var value = true;
|
||||
if (pair.length >= 2) {
|
||||
eval("value = " + decodeURIComponent(pair[1]) + ";");
|
||||
}
|
||||
|
||||
args[key] = value;
|
||||
}
|
||||
|
||||
return args;
|
||||
}
|
||||
|
||||
var gArgs = null;
|
||||
function arg(key) {
|
||||
if (gArgs === null) {
|
||||
gArgs = parseArgs();
|
||||
}
|
||||
|
||||
var ret = gArgs[key];
|
||||
if (ret === undefined)
|
||||
ret = false;
|
||||
|
||||
return ret;
|
||||
}
|
||||
|
||||
function initGL(canvas) {
|
||||
if (arg("nogl"))
|
||||
return null;
|
||||
|
||||
var gl = null;
|
||||
|
||||
var withAA = arg("aa");
|
||||
var withAlpha = arg("alpha");
|
||||
var withDepth = arg("depth");
|
||||
var withPremult = arg("premult");
|
||||
var withPreserve = arg("preserve");
|
||||
var withStencil = arg("stencil");
|
||||
|
||||
try {
|
||||
var argDict = {
|
||||
alpha: withAlpha,
|
||||
depth: withDepth,
|
||||
stencil: withStencil,
|
||||
antialias: withAA,
|
||||
premultipliedAlpha: withPremult,
|
||||
preserveDrawingBuffer: withPreserve,
|
||||
};
|
||||
gl = canvas.getContext("experimental-webgl", argDict);
|
||||
} catch(e) {}
|
||||
|
||||
return gl;
|
||||
}
|
BIN
content/canvas/test/reftest/white-top-left.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
content/canvas/test/reftest/white.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
27
content/canvas/test/reftest/wrapper.html
Normal file
@ -0,0 +1,27 @@
|
||||
<!DOCTYPE HTML>
|
||||
<html class="reftest-wait">
|
||||
<head>
|
||||
<title>Image reftest wrapper</title>
|
||||
<style type="text/css">
|
||||
#image1 { background-color: rgb(10, 100, 250); }
|
||||
</style>
|
||||
<script>
|
||||
// The image is loaded async after the page loads
|
||||
// wait for it to finish loading
|
||||
function onImageLoad() {
|
||||
document.documentElement.removeAttribute("class");
|
||||
};
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<img id="image1">
|
||||
<script>
|
||||
// Use as "wrapper.html?image.png"
|
||||
var imgURL = document.location.search.substr(1);
|
||||
document.images[0].onload = onImageLoad;
|
||||
document.images[0].onerror = onImageLoad;
|
||||
document.images[0].src = imgURL;
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
@ -1,3 +1,8 @@
|
||||
# Canvas reftests
|
||||
# From: /content/test/reftest
|
||||
# To: /content/canvas/test/reftest
|
||||
include ../../canvas/test/reftest/reftest.list
|
||||
|
||||
== bug453105.html bug453105-ref.html
|
||||
== optiontext.html optiontext-ref.html
|
||||
== bug456008.xhtml bug456008-ref.html
|
||||
|
@ -16,7 +16,7 @@
|
||||
<body>
|
||||
<img id="image1">
|
||||
<script>
|
||||
// Use as "wrapper.html?image.png
|
||||
// Use as "wrapper.html?image.png"
|
||||
var imgURL = document.location.search.substr(1);
|
||||
document.images[0].onload = onImageLoad;
|
||||
document.images[0].onerror = onImageLoad;
|
||||
|