html2canvas无法正确显示带有修饰符的表情符号

Question

Html2canvas can't render elements which contain emojis with modfiers such as skin color. For example: 👩🏿 turns into: in Firefox.

Code example:

HTML:

<div id="target">&#128105;&#127999;</div>
<button onclick="takeScreenShot()">to image</button>

JS:

window.takeScreenShot = function() {
    html2canvas(document.getElementById("target"), {
        onrendered: function (canvas) {
            document.body.appendChild(canvas);
        }
    });
}

http://jsfiddle.net/uLw7ozya/1/

Anyone know of a way to fix this? Or will I just have to find a way to remove all the modifiers before rendering?

Answer 1

As noted here , this is something that is currently in the works to be developed.

The accepted solution there is:

FYI the latest beta version of html2canvas supports emoji. I've just tested using https://github.com/niklasvh/html2canvas/releases/tag/v0.5.0-beta4 and it seems to work.