Org Babel, Mermaid JS, and fixing "Failed to launch the browser process" on Ubuntu 24
| emacs, orgMermaid makes pretty diagrams from text. It's Javascript-based, so the command-line tool (mmdc) uses Puppeteer to get the results of evaluating the diagram in the browser. I was running into some errors trying to get it to work from Org Mode over ob-mermaid on Ubuntu 24, since apparently AppArmor restricts Puppeteer. (Error: Failed to launch the browser process! · Issue #730 · mermaid-js/mermaid-cli).
I put together a pull request to modify
ob-mermaid-cli-path so that it doesn't get quoted
and can therefore have the aa-exec command needed
to work around that. With that modified
org-babel-execute:mermaid
, I can then configure
ob-mermaid
like this:
(use-package ob-mermaid :load-path "~/vendor/ob-mermaid") ;; I need to override this so that the executable isn't quoted (setq ob-mermaid-cli-path "aa-exec --profile chrome mmdc -c ~/.config/mermaid/config.json")
I also ran into a problem where the library that
Emacs uses to display SVGs could not handle the
foreignObject
elements used for the labels.
mermaid missing text in svg · Issue #112 ·
mermaid-js/mermaid-cli . Using the following
~/.config/mermaid/config.json
fixed it, and I
put the option in the ob-mermaid-cli-path
above
so that it always gets loaded.
{ "flowchart": { "useMaxWidth": false, "htmlLabels": false } }
Here's sample Mermaid markup and the file it creates:
mindmap root((test)) Node 1 Node 1A Node 1B Node 2 Node 3
Now I can see the labeled diagrams inside Emacs, too.