<!DOCTYPE html>
<html>
<body>
<a id="result"></a>
<script>
if (window.testRunner)
testRunner.dumpAsText();
canvas = document.createElement("canvas");
document.body.appendChild(canvas);
canvas.width = 100;
canvas.height = 100;
ctx = canvas.getContext("2d", {willReadFrequently: true});
ctx.moveTo(25,25);
ctx.arc(25, 25, 25, Math.PI, 500*Math.PI, false);
ctx.closePath();
ctx.moveTo(75, 75);
ctx.arc(75, 75, 25, 500*Math.PI, Math.PI, true);
ctx.fillStyle = '#0f0';
ctx.fill();
var result = document.getElementById("result");
var passed = true;
checkPixel(25, 25, 0, 255, 0, 255);
checkPixel(75, 75, 0, 255, 0, 255);
if (passed) result.innerHTML = "PASSED";
function checkPixel(x, y, r, g, b, a) {
var data = ctx.getImageData(x,y,1,1).data;
var red = data[0];
var green = data[1];
var blue = data[2];
var alpha = data[3];
if (red != r) {
result.innerHTML += "Red should be "+r+", but was "+red+". ";
passed = false;
}
if (green != g) {
result.innerHTML += "green should be "+g+", but was "+green+". ";
passed = false;
}
if (blue != b) {
result.innerHTML += "blue should be "+b+", but was "+blue+". ";
passed = false;
}
if (alpha != a) {
result.innerHTML += "alpha should be "+a+", but was "+alpha+". ";
passed = false;
}
}
</script>
</body>
</html>