mirror/html2canvas
1
0
Fork 0
mirror of https://github.com/niklasvh/html2canvas.git synced 2023-08-10 21:13:10 +03:00
Code Issues Projects Releases Wiki Activity

fix: don't apply text shadows on elements (#1795)

Browse Source 
* Fix for Issue-1638 (https://github.com/niklasvh/html2canvas/issues/1638)
Resolution: Clearing the Shadow Properties after they are consumed
This commit is contained in:
Niklas von Hertzen 2019-04-07 21:36:14 -07:00 committed by GitHub
parent 7027900f49
commit 397595afb5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/renderer/CanvasRenderer.js
View File

@ -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,

12
tests/reftests/text/shadow.html
View File

@ -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>