Good as html2canvas is, these days you may get more milage creating an SVG, putting the HTML content in it as a ForeignObject, and then using the browser's ability to copy an image to a canvas with the SVG as the source. I use that technique in a very complex diagramming app I work on and it never seems to fail regardless of the HTML content. Getting fonts and external styles to work is fun but that wouldn't apply here.
Off-topic, but please tell us more about the diagramming app.
Come to think of it, CSS isn't its strongest side. No support for filters I think. Maybe worth checking it out anyway.
Re:Show HN: GradientMagic
by jordanmarshall on Sunday August 16, 2020 @01:52PM
(#24179712)
I looked into it before, and I don't think html2canvas would work. IIRC the only way to get the gradients was using the screen capture API [1], which works, but requires users to click an authorization prompt before use.
[1] https://developer.mozilla.org/en-US/docs/Web/API/Screen_Capt...
Hm. I've used image-screenshot [1] in the past together with html2canvas to get CSS filter support in screenshots. Don't know if it would work in your scenario though.
https://html2canvas.hertzen.com/