marp-cli-example icon indicating copy to clipboard operation
marp-cli-example copied to clipboard

Rendered page does not work on mobile

Open LukeWood opened this issue 3 years ago • 1 comments

Hello @yhatt ! Thank you for your work on Marp. I love it.

I am working on slides for a conference presentation:

  • GitHub repo (https://github.com/lukewood/devoxx)
  • Live (https://lukewood.github.io/devoxx)

For some reason the live version crashes on iOS mobile. I unfortunately cannot attach my iphone to my work PC, so I cant provide much more insight than that. It just completely fails to load which is a bit weird.

LukeWood avatar Oct 11 '22 12:10 LukeWood

It's known to be caused by a lot of slides, that were patched by the polyfill library to fix broken slide rendering in WebKit. Marp uses SVG as a scaling container, but WebKit has an incorrect rendering. (Bug 23113)

Unfortunately it is a bug of the WebKit browser for mobile itself (Safari and every iOS browsers), and there is no workaround for now. You would be able to avoid crash by setting options: { script: false } in marp.config.js to disable applying polyfill, but Safari must have rendered glitched slides.

A good news is that WebKit is working to fix that. https://bugs.webkit.org/show_bug.cgi?id=90738

  • Related
    • https://github.com/marp-team/marp-core/issues/195
    • https://twitter.com/vixentael/status/1311791221094965254

yhatt avatar Oct 12 '22 10:10 yhatt