underline missing bug

[dongguoqiang1994]

https://jsfiddle.net/w90erdL6/1/

<div id="capture" style="padding: 10px;">
    hehe:<span style="text-decoration-line: underline">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
    hehe:<span style="text-decoration-line: underline">1&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
</div>
<script src="https://unpkg.com/[email protected]/dist/html2canvas.min.js"></script>
<script>
    html2canvas(document.querySelector("#capture")).then(canvas => {
        document.body.appendChild(canvas)
    });
</script>

If the span tag only includes  , the style of text-decoration-line: underline is misplaced. But if it contains any content, such as ​, the style will be okay.

html2canvas version tested with: 1.0.0-alpha.12 Browser & version: latest Chrome and latest Firefox Operating system: Window 10

[sugusgeekery]

Did anyone solve this problem in the end, find a way, and ask the great god to answer! ! !

[otizis]

最新版本问题还是存在，但是在空格中间打一个字比如 <span style="text-decoration-line: underline">&nbsp;&nbsp;&nbsp; 1 &nbsp;&nbsp;&nbsp;</span> 空白的下划线就可以出现。

[threetail]

最新版本问题还是存在，但是在空格中间打一个字比如 <span style="text-decoration-line: underline">&nbsp;&nbsp;&nbsp; 1 &nbsp;&nbsp;&nbsp;</span> 空白的下划线就可以出现。

谢谢你给了我解决这个问题的灵感 在   中 插入一个 ​ 就可以了！

[xweiba]

最新版本问题还是存在，但是在空格中间打一个字比如 <span style="text-decoration-line: underline">&nbsp;&nbsp;&nbsp; 1 &nbsp;&nbsp;&nbsp;</span> 空白的下划线就可以出现。

谢谢你给了我解决这个问题的灵感 在   中 插入一个 ​ 就可以了！

You're a genius.

[xweiba]

Changing the source code from if (isTextNode(childNode) && childNode.data.trim().length > 0) to if (isTextNode(childNode) && childNode.data.length > 0) will fix the issue.

Please note that I have not done further scenario testing.