I'm trying to use html2canvas to get an image of a div to the clipboard so that a user is able to then paste the image in an email or message chat. I've looked up multiple different ways of trying to do this but none of them are working for me.

The code I am using is below.

$(document).on("click", ".canvas-button", function (){
    var div = document.getElementById($(this).data("div"));
    var rect = div.getBoundingClientRect();

    var canvas = document.createElement("canvas");
    canvas.width = rect.width;
    canvas.height = rect.height;

    var ctx = canvas.getContext("2d");
    ctx.translate(-rect.left,-rect.top);

    html2canvas(div, {
        canvas:canvas,
        height:rect.height,
        width:rect.width,
        onrendered: function(canvas) {
            var image = canvas.toDataURL("impage/png");
            window.open(image);
            var pHtml = "<img src="+image+" />";
            $("#parent").append(pHtml);
        }
    });
});

This code is able to find the div but it doesn't give me the image of it. I'm not sure what to do from here. Any help is appreciated.