Re-introduce onclone option (Fix niklasvh#1434)

niklasvh · niklasvh · commit 9fb9898894bb · 2018-02-15T21:40:48.000+08:00
diff --git a/docs/configuration.md b/docs/configuration.md
@@ -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.
diff --git a/src/Clone.js b/src/Clone.js
@@ -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`
diff --git a/src/index.js b/src/index.js
@@ -17,6 +17,7 @@ export type Options = {
     ignoreElements?: HTMLElement => boolean,
     imageTimeout: number,
     logging: boolean,
+    onclone?: Document => void,
     proxy: ?string,
     removeContainer: ?boolean,
     scale: number,
diff --git a/tests/reftests/options/onclone.html b/tests/reftests/options/onclone.html
@@ -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>
