Javascript Canvas:clearRect-after-clip在Firefox中引起问题

我在Firefox中使用canvas clearRect时遇到了一个奇怪的问题。如果设置了剪切区域，则clearRect（）将重新绘制剪切区域和矩形之外的内容以进行清除。因为它把它重新画了一遍，这就引起了一个问题。它在其他浏览器中工作正常，比如Chrome和IE-clearRect不会影响剪辑区域之外的内容

代码如下：

        var canvas = document.getElementById("test");
        var context = canvas.getContext('2d');

        context.fillStyle = 'rgba(255, 0, 0, 0.1)';
        context.fillRect(0, 0, 40, 40);

        context.beginPath();
        context.rect(0, 0, 20, 20);
        context.clip();

        context.clearRect(10, 10, 20, 20); // causes an issue, see example below

---

代码运行：

我在firefox 18和firefox nightly 21上测试了您的代码，没有发现问题。代码执行它应该执行的操作。

在FF18/Mac OS 10.6.8上运行良好。这段代码在Chrome和Firefox 18上对我来说似乎是一样的。虽然这个问题对我来说不再重要，但它仍然不能正常工作。[连结]