Tengo un lienzo negro con cosas que se dibujan en su interior. Quiero que las cosas dibujadas en el interior se desvanezcan a negro, con el tiempo, en el orden en que se dibujan (FIFO). Esto funciona si uso un lienzo que no ha sido redimensionado. Cuando se cambia el tamaño del lienzo, los elementos se desvanecen en un blanco apagado.

Pregunta: ¿Por qué las manchas blancas no se vuelven completamente negras cuando el lienzo se ha redimensionado? ¿Cómo puedo hacer que se desvanezcan a negro de la misma manera que lo hacen cuando no he cambiado el tamaño del lienzo?

Aquí hay un código que demuestra.http://jsfiddle.net/6VvbQ/35/

var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
context.fillRect(0, 0, 300, 150);

// Comment this out and it works as intended, why?
canvas.width = canvas.height = 300;

window.draw = function () {
    context.fillStyle = 'rgba(255,255,255,1)';
    context.fillRect(
        Math.floor(Math.random() * 300),
        Math.floor(Math.random() * 150),
        2, 2);
    context.fillStyle = 'rgba(0,0,0,.02)';
    context.fillRect(0, 0, 300, 150);

    setTimeout('draw()', 1000 / 20);
}
setTimeout('draw()', 1000 / 20);