Черное изображение возвращается из canvas.toBlob

Question

Черное изображение появляется вместо того, чтобы показать обрезанное изображение в моем случае. Я также попытался использовать image.onload. Что может быть причиной этого?

Код:

    const canvas = document.createElement('canvas');
    canvas.width = pixelCrop.width;
    canvas.height = pixelCrop.height;
    const ctx = canvas.getContext('2d');
    const newImage = new Image();

    ctx.drawImage(
      newImage,
      pixelCrop.x,
      pixelCrop.y,
      pixelCrop.width,
      pixelCrop.height,
      0,
      0,
      pixelCrop.width,
      pixelCrop.height
    );

    //image -- <img src='url'/>
    newImage.src = image.src;

    return new Promise((resolve, reject) => {
      canvas.toBlob((blob) => {
        console.log('blob is', blob);
        blob.name = fileName;
        window.URL.revokeObjectURL(this.fileUrl);
        this.fileUrl = window.URL.createObjectURL(blob);
        resolve(this.fileUrl);
      }, 'image/jpeg');
    });

Скриншот