What would cause an HTML5 canvas toBlob to create an incomplete image?

I have the following javascript produce images from a canvas and upload them to a server.

var can = document.createElement('canvas');
can.width = 600;
can.height = 600;
var ctx = can.getContext('2d');
ctx.fillRect(0, 0, can.width, can.height);
ctx.fillText("Julia", can.width/2, can.height/2);
can.toBlob(uploadImage, "image/jpg", 0.9);

function uploadImage(jpeg) {
  var data = new FormData();
  data.append('image', jpeg, 'image.jpg');
  ...
}

Every so often, the result looks like the above, only partially drawn. Multiple canvases are processed and uploaded serially, only moving on in the completion of the ajax (in the ... part), so only one at a time.

Have you seen this happen? If so, where in this process should I debug further? Maybe a setting or something in the context object?

Edit

The upload is an ajax post with a promise resolved only on the success branch. It actually uses angular's $http service:

$http({method: 'POST', url: '...', data: data}).then(function(response) {
    // callback that processes and uploads the next image
});