From 397595afb59ee50f0d128abb5945b5b9ddc6650d Mon Sep 17 00:00:00 2001
From: Niklas von Hertzen <niklasvh@gmail.com>
Date: Sun, 7 Apr 2019 21:36:14 -0700
Subject: [PATCH] fix: don't apply text shadows on elements (#1795)

* Fix for Issue-1638 (https://github.com/niklasvh/html2canvas/issues/1638)
Resolution: Clearing the Shadow Properties after they are consumed
---
 src/renderer/CanvasRenderer.js  |  5 +++++
 tests/reftests/text/shadow.html | 12 ++++++++++++
 2 files changed, 17 insertions(+)

diff --git a/src/renderer/CanvasRenderer.js b/src/renderer/CanvasRenderer.js
index 7363ac0..572ee08 100644
--- a/src/renderer/CanvasRenderer.js
+++ b/src/renderer/CanvasRenderer.js
@@ -235,6 +235,11 @@ export default class CanvasRenderer implements RenderTarget<HTMLCanvasElement> {
                         text.bounds.top + text.bounds.height
                     );
                 });
+
+                this.ctx.shadowColor = '';
+                this.ctx.shadowOffsetX = 0;
+                this.ctx.shadowOffsetY = 0;
+                this.ctx.shadowBlur = 0;
             } else {
                 this.ctx.fillText(
                     text.text,
diff --git a/tests/reftests/text/shadow.html b/tests/reftests/text/shadow.html
index f4e43a4..063a51d 100644
--- a/tests/reftests/text/shadow.html
+++ b/tests/reftests/text/shadow.html
@@ -50,6 +50,18 @@
     <span>testing with transparent</span>
     <strong>testing with low opacity</strong>
 </div>
+
+<div id="capture" style="padding: 10px; background: #f5da55; border:2px solid blue;">
+    <h4 style="color: #000;text-shadow:0px 0px 5px green;">Hello world!</h4>
+    <div id="sampleDiv" style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
+    <div style="border:2px solid red;background-color:pink; padding:5px;margin:5px;">Sample Div with Border</div>
+    <div style="border:2px solid red;color:blue; padding:5px;margin:5px;">Sample Div with Border</div>
+    <div style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
+    <div style="border:2px solid red;padding:5px;text-shadow:0px 0px 5px red;margin:5px;">Sample Div with Border</div>
+    <div style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
+    <div style="border:2px solid red;padding:5px;margin:5px;">Sample Div with Border</div>
+</div>
+
 <p class="white-text-with-blue-shadow">Sed ut perspiciatis unde omnis iste
     natus error sit voluptatem accusantium doloremque laudantium,
     totam rem aperiam, eaque ipsa quae ab illo inventore.</p>