#316 image export changes

src/svgcanvas/svg-exec.js

@@ -778,51 +778,47 @@ export const rasterExport = async function (imgType, quality, exportWindowName,
   const { issues, issueCodes } = getIssues();
   const svg = svgCanvas.svgCanvasToString();
 
-  if (!$id('export_canvas')) {
+  const iframe = document.createElement('iframe');
-    const canvasEx = document.createElement('CANVAS');
+  iframe.onload = function() {
-    canvasEx.id = 'export_canvas';
+    const iframedoc=iframe.contentDocument||iframe.contentWindow.document;
-    canvasEx.style.display = 'none';
+    const ele = svgContext_.getSVGContent();
-    document.body.appendChild(canvasEx);
+    const cln = ele.cloneNode(true);
-  }
+    iframedoc.body.appendChild(cln);
-  const c = $id('export_canvas');
+    setTimeout(function(){
-  c.style.width = svgCanvas.contentW + "px";
+      // eslint-disable-next-line promise/catch-or-return
-  c.style.height = svgCanvas.contentH + "px";
+      html2canvas(iframedoc.body, { useCORS: true, allowTaint: true }).then((canvas) => {
-  const canvg = svgContext_.getcanvg();
+        return new Promise((resolve) => {
-  const ctx = c.getContext('2d');
+          const dataURLType = type.toLowerCase();
-  const v = canvg.fromString(ctx, svg);
+          const datauri = quality
-  // Render only first frame, ignoring animations.
+            ? canvas.toDataURL('image/' + dataURLType, quality)
-  await v.render();
+            : canvas.toDataURL('image/' + dataURLType);
-  // Todo: Make async/await utility in place of `toBlob`, so we can remove this constructor
+          iframe.parentNode.removeChild(iframe);
-  return new Promise((resolve) => {
+          let bloburl;
-    const dataURLType = type.toLowerCase();
+
-    const datauri = quality
+          function done() {
-      ? c.toDataURL('image/' + dataURLType, quality)
+            const obj = {
-      : c.toDataURL('image/' + dataURLType);
+              datauri, bloburl, svg, issues, issueCodes, type: imgType,
-    let bloburl;
+              mimeType, quality, exportWindowName
-    /**
+            };
- * Called when `bloburl` is available for export.
+            if (!opts.avoidEvent) {
- * @returns {void}
+              svgContext_.call('exported', obj);
- */
+            }
-    function done() {
+            resolve(obj);
-      const obj = {
+          }
-        datauri, bloburl, svg, issues, issueCodes, type: imgType,
+          if (canvas.toBlob) {
-        mimeType, quality, exportWindowName
+            canvas.toBlob((blob) => {
-      };
+              bloburl = createObjectURL(blob);
-      if (!opts.avoidEvent) {
+              done();
-        svgContext_.call('exported', obj);
+            }, mimeType, quality);
-      }
+            return;
-      resolve(obj);
+          }
-    }
+          bloburl = dataURLToObjectURL(datauri);
-    if (c.toBlob) {
+          done();
-      c.toBlob((blob) => {
+        });
-        bloburl = createObjectURL(blob);
+      });
-        done();
+    }, 1000);
-      }, mimeType, quality);
+  };
-      return;
+  document.body.appendChild(iframe);
-    }
-    bloburl = dataURLToObjectURL(datauri);
-    done();
-  });
 };
 
 /**