pdf_from_url CSS not working

[veeKewl]

Im using the WickedPdf.new.pdf_from_url and whatever i do it always generate a file with almost no CSS honored.

This is the sample using "https://github.com/mileszs/wicked_pdf" as url

[unixmonkey]

The output here is exactly the same as if you ran wkhtmltopdf https://github.com/mileszs/wicked_pdf/ out.pdf.

For example if you run wkhtmltopdf https://csszengarden.com/221/ out.pdf, you'll see plenty of colors and CSS being applied, because the CSS it uses is more compatible with an older browser engine.

I think the real problem isn't that the CSS styling isn't being applied, but it's that the CSS engine inside of wkhtmltopdf is too old to understand the CSS that GitHub currently serves up. I don't blame GitHub. Most people browsing code have up-to-date browsers, and they can save bandwidth by using modern CSS, HTML, & JS.

wkhtmltopdf is based off an early version of Chrome's webkit, circa 2013, which only barely supported early HTML5, and some ES2015 JS, and no CSS3 that I know of. When Chrome stopped contributing to the open-source effort, the engine behind wkhtmltopdf stopped getting updates, even though the code kept being maintained to fix mostly non-rendering-engine issues. Chrome kept getting updated, but the open-source fork of webkit did not.

Recently, the wkhtmltopdf project has shut down entirely. This project will always work for people already using it, and those writing their HTML, CSS, & JS in an older way, but for new projects, you should consider an alternative, like Headless Chrome with Puppeteer for more modern support.

You can find more on this and a bunch of alternatives in this issue: #1081

[Viktor-Ivliev]

Unfortunately, most binaries really can't even support var in css and are now becoming useless. I originally used my solution with chromium but it was accompanied by a lot of pain, here (https://github.com/Studiosity/grover) is a solution that is less painful. It's a shame so many good solutions die so quickly.

[veeKewl]

Decided to use Grover. lol