Marp pdf outputs starts with 4 pages of CSS

[Hultner]

Update: Tracked it down, it's due to the latest chrome update, see end of issue.

Version of Marp Tool

@marp-team/marp-cli v1.5.2 (w/ @marp-team/marp-core v2.3.2), Marp for VS Code v1.4.7

Operating System

macOS

Environment

• OS version: macOS 10.15.7
• Node.js version (Marpit / Marp Core/ Marp CLI): Node.js v17.4.0
• VS Code version (Marp for VS Code): Version: 1.63.1

How to reproduce

1. Export PDF from marp presentation, either via VS-Code or cli, bug occurs for both
2. Open pdf
3. First 4 pages are CSS code

Screenshot

I've tried the following:

• A standard presentation with a bunch of pages
• Empty slideshow (only the marp frontmatter)
• A slidesshow which I successfully produced PDFs from Monday/Tuesday this week
  All these show the exact same error. If I generate HTML it's fine.

Expected behavior

I expect the PDF without the 4 leading pages of CSS code.

Actual behavior

Every presentation is prepended with 4 slides showing css code. See screenshot.
Screenshot

Additional information

I was using Marp only earlier this week and it worked fantastically.
I was not sure where to report this but considering the bug appears both in CLI and the extension I suspect a bug in core.

EDIT: Just noticed that it's more that's messed up, bullet list no longer appear as bullet lists for instance. The preview in VS-Code still looks normal.
EDIT 2: Tried with more themes and the result is even worse. I also tried running marp on my other computer which is running marp cli v1.5.0 and I get the same strange result which doesn't make sense to me.

Edit 3: It's chrome! It was puzzling me that the other computer exhibited the same issues without updating the OS or marp. Continued investigated and realised marp is backed by chrome for PDF generation. Linked marp to an older version of chromium instead and voila, I can create working slides again. So it seems like the marp print css/html is incompatible with the latest chrome version.

[yhatt]

Transferred issue from Marp Core ▶️ Marp CLI 🚚. Marp's PDF conversion belongs to Marp CLI, and Marp for VS Code is using Marp CLI internally.

---

I've tested PDF conversion with the latest stable Chrome (Chromium) 97.0.4692.99, but we have met no problems in the output PDF. I've tried to reproduce against beta version v98 and dev version v99, and they return the correct output too. Instead, it can reproduce if used Chrome Canary 100.0.4859.0.

For easy to catch a bug early, Marp will try to use the unstable canary version of Chrome if installed. (you can see which version of Chrome to use for conversion by setting DEBUG env as puppeteer:launcher)

If possible, just uninstalling Chrome Canary will help your workflow. If you have to keep Canary version for some reasons, set CHROME_PATH env as a path to executable of stable Chrome.

From the above, it seems to be clear that leaking the content of <style> is a regression of the upstream Chrome in development. We believe it will be resolved over time by patch to Chromium and update of Puppeteer dependency, so Marp team does not have any actions to Marp for now. If this problem was becoming apparent in future, we have to think applying patch to Marp.

[yhatt]

I've reported to Chromium crbug with minimal reproducible example that is using --print-to-pdf: https://bugs.chromium.org/p/chromium/issues/detail?id=1292341

[Hultner]

Transferred issue from Marp Core ▶️ Marp CLI 🚚. Marp's PDF conversion belongs to Marp CLI, and Marp for VS Code is using Marp CLI internally.

I've tested PDF conversion with the latest stable Chrome (Chromium) 97.0.4692.99, but we have met no problems in the output PDF. I've tried to reproduce against beta version v98 and dev version v99, and they return the correct output too. Instead, it can reproduce if used Chrome Canary 100.0.4859.0.

For easy to catch a bug early, Marp will try to use the unstable canary version of Chrome if installed. (you can see which version of Chrome to use for conversion by setting DEBUG env as puppeteer:launcher)

If possible, just uninstalling Chrome Canary will help your workflow. If you have to keep Canary version for some reasons, set CHROME_PATH env as a path to executable of stable Chrome.

From the above, it seems to be clear that leaking the content of <style> is a regression of the upstream Chrome in development. We believe it will be resolved over time by patch to Chromium and update of Puppeteer dependency, so Marp team does not have any actions to Marp for now. If this problem was becoming apparent in future, we have to think applying patch to Marp.

Thanks, that would be it, I do have Chrome Canary installed as I need it for work. Didn't know it was used by Marp. As a somewhat hacky but totally working solution I added a suffix to the Canary app name, which made Marp pick up regular chrome instead and work again.

[yhatt]

It should have been fixed by https://chromium-review.googlesource.com/c/chromium/src/+/3428144. Update your Canary to 100.0.4863.0 or later, and retry to convert into PDF.