fix: copy original onerror into clonedNode

src/clone-node.ts

@@ -9,7 +9,7 @@ async function cloneCanvasElement(canvas: HTMLCanvasElement) {
   if (dataURL === 'data:,') {
     return canvas.cloneNode(false) as HTMLCanvasElement
   }
-  return createImage(dataURL)
+  return createImage(dataURL, canvas.onerror)
 }
 
 async function cloneVideoElement(video: HTMLVideoElement, options: Options) {
@@ -20,13 +20,13 @@ async function cloneVideoElement(video: HTMLVideoElement, options: Options) {
     canvas.height = video.clientHeight
     ctx?.drawImage(video, 0, 0, canvas.width, canvas.height)
     const dataURL = canvas.toDataURL()
-    return createImage(dataURL)
+    return createImage(dataURL, video.onerror)
   }
 
   const poster = video.poster
   const contentType = getMimeType(poster)
   const dataURL = await resourceToDataURL(poster, contentType, options)
-  return createImage(dataURL)
+  return createImage(dataURL, video.onerror)
 }
 
 async function cloneIFrameElement(iframe: HTMLIFrameElement) {
@@ -133,11 +133,11 @@ function cloneCSSStyle<T extends HTMLElement>(nativeNode: T, clonedNode: T) {
       ) {
         value = 'block'
       }
-      
+
       if (name === 'd' && clonedNode.getAttribute('d')) {
         value = `path(${clonedNode.getAttribute('d')})`
       }
-      
+
       targetStyle.setProperty(
         name,
         value,

src/embed-images.ts

@@ -55,10 +55,11 @@ async function embedImageNode<T extends HTMLElement | SVGImageElement>(
   const dataURL = await resourceToDataURL(url, getMimeType(url), options)
   await new Promise((resolve, reject) => {
     clonedNode.onload = resolve
+    const originalOnError = clonedNode.onerror
     clonedNode.onerror = async (...params) => {
-      if (clonedNode.onerror) {
+      if (originalOnError) {
         try {
-          const result = await clonedNode.onerror(...params)
+          const result = await originalOnError(...params)
           resolve(result)
         } catch (error) {
           reject(error)

src/index.ts

@@ -31,7 +31,7 @@ export async function toCanvas<T extends HTMLElement>(
 ): Promise<HTMLCanvasElement> {
   const { width, height } = getImageSize(node, options)
   const svg = await toSvg(node, options)
-  const img = await createImage(svg)
+  const img = await createImage(svg, node.onerror)
 
   const canvas = document.createElement('canvas')
   const context = canvas.getContext('2d')!

src/util.ts

@@ -180,12 +180,23 @@ export function canvasToBlob(
   })
 }
 
-export function createImage(url: string): Promise<HTMLImageElement> {
+export function createImage(
+  url: string,
+  onerror: OnErrorEventHandler,
+): Promise<HTMLImageElement> {
   return new Promise((resolve, reject) => {
     const img = new Image()
     img.decode = () => resolve(img) as any
     img.onload = () => resolve(img)
-    img.onerror = reject
+    img.onerror = onerror
+      ? async (...props) => {
+          try {
+            resolve(await onerror(...props))
+          } catch (error) {
+            reject(error)
+          }
+        }
+      : reject
     img.crossOrigin = 'anonymous'
     img.decoding = 'async'
     img.src = url