html2canvas code not working IE 11

Question

I am hoping to use the html2canvas library to make a image of one div and put it in another. So far I have it working wonderfully in Safari, Chrome, and Firefox but not IE (11 is the only version I care about right now).

I am applying it using the code from this jsfiddle from another Stackoverflow question:

var aaaDiv=document.getElementById('aaa');
var ttDiv=document.getElementById('tt');

html2canvas(aaaDiv).then(function(canvas) {
// assign id:avatarCanvas to canvas 
canvas.id='avatarCanvas';
// append canvas to ttDiv
ttDiv.appendChild(canvas);

});

https://jsfiddle.net/m1erickson/wtchz972/

I heard IE doesn't like to 'appendChild', but I am not sure how to proceed from there.

Solution 1

The appendChild function has nothing to do with the issue you're facing. appendChild has been supported ever since IE6+

By looking at the html2canvas code, the library happens to make use of the Promises feature which unfortunately is not being supported in any version of IE

http://caniuse.com/#search=promises

(though it is supported in Microsoft Edge)

Solution 2

Add this 2 JS - It will automatically provides/replaces Promise if missing or broken.

<script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.min.js"></script> 

Source: Comment by Arthez on Roman Canlas's post & https://github.com/stefanpenner/es6-promise