fix: image loading="lazy" fix #2312 (#2314)

This commit is contained in:
Niklas von Hertzen 2020-08-08 15:37:34 +08:00 committed by GitHub
parent 04e145b5eb
commit f23e6f6f26
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 12 additions and 2 deletions

View File

@ -5,6 +5,7 @@ import {
isElementNode,
isHTMLElementNode,
isIFrameElement,
isImageElement,
isScriptElement,
isSelectElement,
isStyleElement,
@ -128,7 +129,15 @@ export class DocumentCloner {
return this.createStyleClone(node);
}
return node.cloneNode(false) as HTMLElement;
const clone = node.cloneNode(false) as HTMLElement;
// @ts-ignore
if (isImageElement(clone) && clone.loading === 'lazy') {
// @ts-ignore
clone.loading = 'eager';
}
return clone;
}
createStyleClone(node: HTMLStyleElement): HTMLStyleElement {

View File

@ -25,7 +25,7 @@ const html2canvas = (element: HTMLElement, options: Partial<Options> = {}): Prom
export default html2canvas;
if (typeof window !== "undefined") {
if (typeof window !== 'undefined') {
CacheStorage.setContext(window);
}

View File

@ -7,6 +7,7 @@
</head>
<body>
<img src="../../assets/image.jpg" />
<img src="../../assets/image.jpg" loading="lazy" />
<img src="../../assets/image.jpg" style="width:50px;height:400px;" />
<img src="../../assets/image.jpg" style="width:500px;" />
<img src="../../assets/image.jpg" style="width:100px;border-radius:50px;" />