search

parallax / jsPDF

Client-side JavaScript PDF generation for everyone.
https://parall.ax/products/jspdf
MIT License
28.94k stars 4.63k forks source link

`html` method fails to parse modern CSS functions such as `color` #3744

Open BSoDium opened 2 months ago

BSoDium commented 2 months ago

I have read and understood the contribution guidelines.

When running the html() method on document.body in my project, the html to canvas conversion process seems to fail with the following error:

Attempting to parse an unsupported color function "color"
    at Object.parse (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:1900:17)
    at parse (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:3939:28)
    at new CSSParsedDeclaration (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:3815:30)
    at new ElementContainer (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:3983:21)
    at createContainer (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:4956:12)
    at parseNodeTree (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:4906:27)
    at parseNodeTree (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:4921:15)
    at parseNodeTree (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:4921:15)
    at parseTree (http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:4961:5)
    at http://localhost:3000/static/js/vendors-node_modules_html2canvas_dist_html2canvas_js.chunk.js:7702:20

I believe this to be linked to html2canvas's lack of support for modern css functions, including the newly available color(...).

My problem here is that I would like to use html2canvas-pro as a replacement for html2canvas, as it does specifically support these, but I have no idea where to start, as this issue doesn't seem to have been reported earlier, and I see no way to customize the canvasification process.

Here is a temporary deployment which reproduces the bug when clicking the download button (dismiss the ad-blocker banner, then click on the blue download button)

And here is the PR implementing this: https://github.com/BSoDium/bsodium.fr/pull/53

Thanks a lot in advance!

BSoDium commented 1 month ago

Hi @Uzlopak 👋 do you think anyone from the parallax team could take a look at this? It's a bit of a blocker for me at the moment 😞