title: canvas toDataURL give me an uncorrect base64 code
body: <p>I am using canvas to draw cropped image with base 64 but the problem is that my code is working on Chrome but it was give me a blank image on Firefox</p>
  <pre><code>async function base64SquareCrop(imgbase64, size = 224) {
  const img = document.createElement(&quot;img&quot;);
  await img.setAttribute(&quot;src&quot;, imgbase64);
  
  let width = img.width;
  let height = img.height;
  const min = Math.min(width, height);
  const scale = size / min;
  const scaledW = Math.ceil(width * scale);
  const scaledH = Math.ceil(height * scale);
  const dx = scaledW - size;
  const dy = scaledH - size;
  canvasImage.width = canvasImage.height = size;
  const ctx_img = canvasImage.getContext(&quot;2d&quot;);
  await ctx_img.drawImage(
      img,
      ~~(dx / 2) * -1,
      ~~(dy / 2) * -1,
      scaledW,
      scaledH
  );
  return canvasImage.toDataURL(&quot;image/png&quot;);
  }
  </code></pre>