[WIP] Replaced html2canvas with dom-to-image-more

[hakimio]

While much slower in general, in some cases (for example, box shadows) dom-to-image-more produces much better results. This a simple experiment showing that html2canvas could be replaced by dom-to-image.

Page-breaks seem to be working correctly but part of the content is cut-off. Might be because we are not waiting until our iframe is loaded completely. Haven't verified yet.

PS: Also, fixed few issues found by JetBrains WebStorm IDE static analysis.

[hakimio]

Even after waiting for iframe to load, part of the content is still cut-off. No idea why.

[eKoopmans]

Hi @hakimio, thanks for the PR! And sorry I didn't have a look sooner.

dom-to-image uses svg <foreignObject> rendering, which has mixed support (doesn't work at all in IE11 and below). html2canvas does have a foreignObject option, have you tried using it?

There may be room for allowing multiple renderer options in the future, but I don't think I'll replace html2canvas entirely, especially because of the lack of IE support.

[hakimio]

@eKoopmans yes, I've tried foreign object option in html2canvas but it was resulting in blank image. Never got it to work.

IE11 has 5% worldwide desktop browser market share (or 2.29% all browser), is 6 years old and a lot of companies choose to just stop supporting it. It's a terrible browser and it's time for it to go away. Also, the latest versions of html2canvas produce broken results when used with IE11.

Anyway, this was just an experiment which didn't work that well. Feel free to close this PR.

[eKoopmans]

Okay, fair enough. Like I said I am open to supporting multiple renderers, and I have looked into dom-to-image and other foreignObject options in the past. I was discouraged by the lack of support in various browsers, not only IE.

A few relevant threads:

• foreignObjectRendering issues niklasvh/html2canvas#1295
• niklasvh/html2canvas#1167
• html2pdf.js Project: New renderer

I'll keep this PR open in case you get dom-to-image working, we can look at ways to integrate it beside other options.

[sauravgaursmith]

@hakimio I really appreciate your work. Actually I was also looking for similar issue. With Html2Canvas facing slowness.IE has been dropped now. Therefore @eKoopmans can you now consider this PR to be merged. It will help a lot of developers.

Also, In case you want to have Html2Canvas can we have a flag based implementation for both html2canvas and dom-to-image ?

Thank you.

[hakimio]

@sauravgaursmith this is incomplete proof-of-concept. If you would like to use dom-to-image instead of html2canvas, feel free to create a new PR with complete implementation. I am not planning to continue working on this.