Home

Pycharm broken mermaid diagrams in markdown files

Updated:
Created:

When displaying a mermaid diagram in a markdown file for the second time, the image of the display actually doesn't get displayed.

Problem:

When displaying a mermaid diagram in a markdown file for the second time, the image of the display actually doesn't get displayed.

This seems to be caused by line breaks. Here is a minimal file:

foo
```mermaid
graph TD

write-->world[hello<br/>world]
```
bar

If you look in the cache directory ~/.cache/JetBrains/PyCharm2020.3/markdown/MermaidCodeGeneratingProviderExtension/<some random id> you will see that the svg actually gets written out as

...
hello<br>world
...

Which I guess then can't be parsed back when reading the cached file (at least firefox throws an error).

Workaround:

Disable the caching

rm -Rf ~/.cache/JetBrains/PyCharm2020.3/markdown/MermaidCodeGeneratingProviderExtension/*
chmod 555 ~/.cache/JetBrains/PyCharm2020.3/markdown/MermaidCodeGeneratingProviderExtension

Learned:

The caching directory is a good source for rendered mermaid svgs (in theory)

I filled a bug: https://youtrack.jetbrains.com/issue/IDEA-265268