Image is not generated by html2canvas in firefox without giving any errors

po95-backup commented 5 years ago

Here is my code of generating a image on chrome, firefox and other browsers. When i click on my function to generate a image in firefox, the browser holds the request and after sometime it prints some outputs without downloading the image

var node = document.querySelector("#pop-up-table");
            html2canvas(node, {}).then(function(canvas){
                var userAgent = navigator.userAgent;
                var a = document.createElement('a');
                if(userAgent.search('Chrome') >= 0){
                    a.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
                    a.download = 'table.png';
                } else {
                    a.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
                    a.download = 'table.jpg';
                }
                a.click();
            });

I modified the code slightly for firefox (will generate jpg for firefox and other browsers) other than chrome because of a claim on a comment in this post (here)

16df332f834 0ms Starting document clone                                   html2canvas.min.js:20:84099
16df332f834 3798ms Document cloned, using computed rendering              html2canvas.min.js:20:84099
16df332f834 3799ms Starting DOM parsing                                   html2canvas.min.js:20:84099
16df332f834 10556ms Starting renderer                                     html2canvas.min.js:20:84099
16df332f834 10557ms Canvas renderer initialized 
(770x1184 at 197,96.60000610351562)with scale 1                           html2canvas.min.js:20:84099
16df332f834 27498ms Finished rendering                                    html2canvas.min.js:20:84099

Have seen these solutions below but it didn't bring any good:

NB: I call this code snippet in a setTimeout() function and increasing time didn't help