diff --git a/src/dom-to-image-more.js b/src/dom-to-image-more.js index 0e4bc361..65428000 100644 --- a/src/dom-to-image-more.js +++ b/src/dom-to-image-more.js @@ -1,4 +1,4 @@ -(function(global) { +(function(window) { 'use strict'; var util = newUtil(); @@ -35,7 +35,7 @@ if (typeof exports === "object" && typeof module === "object") module.exports = domtoimage; else - global.domtoimage = domtoimage; + window.domtoimage = domtoimage; /** * @param {Node} node - The DOM Node object to render @@ -261,7 +261,7 @@ }); function cloneStyle() { - copyStyle(window.getComputedStyle(original), clone.style); + copyStyle(getUserComputedStyle(original, root), clone.style); function copyFont(source, target) { target.font = source.font; @@ -842,4 +842,29 @@ } } } + + function getUserComputedStyle(element, root) { + var computedStyles = window.getComputedStyle(element); + var inlineStyles = element.style; + + for (var i = 0; i < computedStyles.length; i++) { + var key = computedStyles[i]; + var value = computedStyles.getPropertyValue(key); + var inlineValue = inlineStyles.getPropertyValue(key); + + if (!inlineValue.length) { + inlineStyles.setProperty(key, root ? 'initial' : 'unset'); + + var initialValue = computedStyles.getPropertyValue(key); + + if (initialValue !== value) { + inlineStyles.setProperty(key, value); + } else { + inlineStyles.removeProperty(key); + } + } + } + + return inlineStyles; + } })(this);