Fix background style being overridden.

exupero · Feb 7, 2019 · c378d19 · c378d19
1 parent 2204566
commit c378d19
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -310,6 +310,11 @@ <h3>Preview <button class="save btn">Save as PNG</button></h3>
       </svg>
     </li>
 
+    <li id=style-background>
+      <svg width="200" height="200" style="background:green">
+      </svg>
+    </li>
+
     <li id=custom-font>
       <svg width=200 height=200>
         <text x=100 y=100 text-anchor=middle dy=14 style="font-family:'Stalemate';font-size:36pt;">Custom Fonts</text>

diff --git a/index.js b/index.js
@@ -82,6 +82,7 @@ inlineTest('When setting xmlns on foreign object children', $('#xmlns-override')
 inlineTest('When using HTML entites', $('#entities'));
 inlineTest('Transformed text', $('#transformed-text'));
 inlineTest('With marker-end', $('#marker-end'));
+inlineTest('SVG style attribute', $('#style-background'));
 inlineTest('With custom fonts', $('#custom-font'));
 
 const $sandbox = $('#sandbox');

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "save-svg-as-png",
-  "version": "1.4.6",
+  "version": "1.4.8",
   "description": "Convert a browser SVG to PNG or dataUri",
   "main": "lib/saveSvgAsPng.js",
   "scripts": {

diff --git a/src/saveSvgAsPng.js b/src/saveSvgAsPng.js
@@ -222,8 +222,7 @@
 
     return inlineImages(el).then(() => {
       let clone = el.cloneNode(true);
-      const {backgroundColor = 'transparent'} = options || {};
-      clone.style.backgroundColor = backgroundColor;
+      clone.style.backgroundColor = (options || {}).backgroundColor || el.style.backgroundColor;
       const {width, height} = getDimensions(el, clone, w, h);
 
       if (el.tagName !== 'svg') {