Re-introduce onclone option (Fix #1434)

This commit is contained in:
Niklas von Hertzen 2018-02-15 21:40:34 +08:00
parent 952eb4cf7c
commit 9fb9898894
4 changed files with 56 additions and 5 deletions

View File

@ -19,6 +19,7 @@ These are all of the available configuration options.
| imageTimeout | `15000` | Timeout for loading an image (in milliseconds). Set to `0` to disable timeout.
| ignoreElements | `(element) => false` | Predicate function which removes the matching elements from the render.
| logging | `true` | Enable logging for debug purposes
| onclone | `null` | Callback function which is called when the Document has been cloned for rendering, can be used to modify the contents that will be rendered without affecting the original source document.
| proxy | `null` | Url to the [proxy](/proxy/) which is to be used for loading cross-origin images. If left empty, cross-origin images won't be loaded.
| removeContainer | `true` | Whether to cleanup the cloned DOM elements html2canvas creates temporarily
| scale | `window.devicePixelRatio` | The scale to use for rendering. Defaults to the browsers device pixel ratio.

View File

@ -611,14 +611,21 @@ export const cloneWindow = (
documentClone.documentElement.style.left = -bounds.left + 'px';
documentClone.documentElement.style.position = 'absolute';
}
const result = Promise.resolve([
cloneIframeContainer,
cloner.clonedReferenceElement,
cloner.resourceLoader
]);
const onclone = options.onclone;
return cloner.clonedReferenceElement instanceof cloneWindow.HTMLElement ||
cloner.clonedReferenceElement instanceof ownerDocument.defaultView.HTMLElement ||
cloner.clonedReferenceElement instanceof HTMLElement
? Promise.resolve([
cloneIframeContainer,
cloner.clonedReferenceElement,
cloner.resourceLoader
])
? typeof onclone === 'function'
? Promise.resolve().then(() => onclone(documentClone)).then(() => result)
: result
: Promise.reject(
__DEV__
? `Error finding the ${referenceElement.nodeName} in the cloned document`

View File

@ -17,6 +17,7 @@ export type Options = {
ignoreElements?: HTMLElement => boolean,
imageTimeout: number,
logging: boolean,
onclone?: Document => void,
proxy: ?string,
removeContainer: ?boolean,
scale: number,

View File

@ -0,0 +1,42 @@
<!DOCTYPE html>
<html>
<head>
<title>element render test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
h2cOptions = {onclone: function(document) {
const remove = document.querySelector('.ignored');
remove.parentNode.removeChild(remove);
}};
</script>
<script type="text/javascript" src="../../test.js"></script>
<style>
#div1 {
width: 100px;
height: 100px;
background: green;
}
#ignored, .ignored {
background: red;
width: 100px;
height: 100px;
}
body, html {
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<div class="ignored">
ignore during onclone
</div>
<div id="div1">
great success
</div>
</body>
</html>