Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
BSoDium opened this issue Jun 25, 2024 · 4 comments
Open

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

BSoDium opened this issue Jun 25, 2024 · 4 comments

Comments

@BSoDium
Copy link

BSoDium commented Jun 25, 2024

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: BSoDium/bsodium.fr#53

Thanks a lot in advance!

@BSoDium BSoDium changed the title html() method fails to parse modern CSS functions such as color() html method fails to parse modern CSS functions such as color Jun 25, 2024
@BSoDium
Copy link
Author

BSoDium commented Jul 15, 2024

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 😞

@Karalix
Copy link

Karalix commented Sep 15, 2024

Exact same problem here... I hope you'll be able to fix it soon :)

@Juman8
Copy link

Juman8 commented Oct 8, 2024

Please refer to it, it is working fine for me:
#3748 (comment)

@BSoDium
Copy link
Author

BSoDium commented Oct 8, 2024

Thank you @Juman8 , I'll take a look

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants