diff --git a/src/clone-node.ts b/src/clone-node.ts index 500ce332..969f36a0 100644 --- a/src/clone-node.ts +++ b/src/clone-node.ts @@ -133,11 +133,11 @@ function cloneCSSStyle(nativeNode: T, clonedNode: T) { ) { value = 'block' } - + if (name === 'd' && clonedNode.getAttribute('d')) { value = `path(${clonedNode.getAttribute('d')})` } - + targetStyle.setProperty( name, value, diff --git a/src/embed-images.ts b/src/embed-images.ts index aa552e8f..59b6feb4 100644 --- a/src/embed-images.ts +++ b/src/embed-images.ts @@ -54,22 +54,24 @@ async function embedImageNode( const dataURL = await resourceToDataURL(url, getMimeType(url), options) await new Promise((resolve, reject) => { - clonedNode.onload = resolve clonedNode.onerror = reject - const image = clonedNode as HTMLImageElement - if (image.decode) { - image.decode = resolve as any - } - - if (image.loading === 'lazy') { - image.loading = 'eager' - } - if (isImageElement) { + if (clonedNode.loading === 'lazy') { + clonedNode.loading = 'eager' + } + clonedNode.srcset = '' clonedNode.src = dataURL + + // `src` should be set before calling `decode` + if (clonedNode.decode) { + clonedNode.decode().then(resolve).catch(reject) + } else { + clonedNode.onload = resolve + } } else { + clonedNode.onload = resolve clonedNode.href.baseVal = dataURL } }) diff --git a/src/util.ts b/src/util.ts index d418b621..829d64c8 100644 --- a/src/util.ts +++ b/src/util.ts @@ -183,12 +183,20 @@ export function canvasToBlob( export function createImage(url: string): Promise { return new Promise((resolve, reject) => { const img = new Image() - img.decode = () => resolve(img) as any - img.onload = () => resolve(img) - img.onerror = reject img.crossOrigin = 'anonymous' img.decoding = 'async' img.src = url + img.onerror = reject + + // `src` should be set before calling `decode` + if (img.decode) { + img + .decode() + .then(() => resolve(img)) + .catch(reject) + } else { + img.onload = () => resolve(img) + } }) }