# Mermaid rendering
**URL:** https://discourse.joplinapp.org/t/mermaid-rendering/22456
**Category:** Support
**Created:** [18 December 2021 07:46 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456 "2021-12-18T07:46:50Z")
**Posts on this page:** 16
**Page:** 1
### Author:  [@ocns](https://discourse.joplinapp.org/u/ocns)
#### Post date: [18 December 2021 07:46 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/1 "2021-12-18T07:46:50Z")
I am using Joplin 2.6.9 on Mac OS 12.0.1.
I can't find how to export the rendered version of a Mermaid diagram. I only get the markdown version.
I tried to look for some settings in the preferences but did not see anything related to Mermaid, even in the plugins.
Thanks for your help!
---
### Author:  [@graphit0](https://discourse.joplinapp.org/u/graphit0)
#### Post date: [18 December 2021 09:26 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/2 "2021-12-18T09:26:52Z")
Hey, have you tried exporting the note in pdf or html?
Also, you can download the rendered chart in png and svg from [mermaid - Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.](https://mermaid-js.github.io/mermaid/#/)
---
### Author:  [@ocns](https://discourse.joplinapp.org/u/ocns)
#### Post date: [18 December 2021 12:07 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/3 "2021-12-18T12:07:53Z")
Thank you @graphit0! I did not notice the live editor, at least I can get the figure out.
I did try both html and pdf in Joplin, none came out with the rendered diagram.
---
### Author:  [@fisher](https://discourse.joplinapp.org/u/fisher)
#### Post date: [18 December 2021 19:14 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/4 "2021-12-18T19:14:18Z")
Same issue here on Windows with 2.6.9. 2.6.2 seems to be the last version to export to PDF properly.
````auto
```mermaid
graph LR
node1 --- node2
````
renders as code in 2.6.4 and above, but renders as a graph in 2.6.2
---
### Author:  [@graphit0](https://discourse.joplinapp.org/u/graphit0)
#### Post date: [18 December 2021 21:44 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/5 "2021-12-18T21:44:20Z")
Thanks. Yeah, I tested it on windows as well and could reproduce it. Indeed, the rendered mermaid graph doesn't export via PDF.
On linux (2.6.9) works fine though. Once I collect the logs and other info, I will open up the issue on github.
---
### Author:  [@tessus](https://discourse.joplinapp.org/u/tessus)
#### Post date: [18 December 2021 23:34 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/6 "2021-12-18T23:34:42Z")
I have upgraded Mermaid and also committed another fix for Mermaid. I have reverted both and it still does not work, so it has nothing to do with these 2 commits.
Unfortunately I don't know what the culprit is, but least I could eliminate my 2 commits related to Mermaid.
---
### Author:  [@fisher](https://discourse.joplinapp.org/u/fisher)
#### Post date: [19 December 2021 00:35 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/7 "2021-12-19T00:35:28Z")
@graphit0 Since you mentioned Linux, I checked on Arch (5.15.8-zen) with a manually downloaded appimage and PopOS 21.10 (5.15.5-generic) with the Joplin\_install\_and\_update.sh script. Both give the same error when trying to export PDF:
```auto
Error: ENOENT: no such file or directory, open '/home/user/.config/joplin-desktop/tmp/pluginassets/katex/katex.css'
at Object.openSync (fs.js:498)
at Object.func [as openSync] (electron/js2c/asar_bundle.js:5)
at Object.readFileSync (fs.js:394)
at Object.e.readFileSync (electron/js2c/asar_bundle.js:5)
at processLinkTag (node_modules/@joplin…ck/dist/index.js:92)
at Object.onopentag (node_modules/@joplin…k/dist/index.js:154)
at Parser.onopentagend (node_modules/@joplin…2/lib/Parser.js:203)
at Tokenizer._stateBeforeAttributeName (node_modules/@joplin…ib/Tokenizer.js:201)
at Tokenizer._parse (node_modules/@joplin…ib/Tokenizer.js:605)
at Tokenizer.write (node_modules/@joplin…ib/Tokenizer.js:585)
```
Running the 2.6.2 appimage works fine. @tessus could it be an issue with the export an not Mermaid rendering?
---
### Author:  [@tessus](https://discourse.joplinapp.org/u/tessus)
#### Post date: [19 December 2021 00:52 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/8 "2021-12-19T00:52:45Z")
> [@fisher](#):
>
> could it be an issue with the export an not Mermaid rendering?
It certainly looks that way, but I don't get any errors in the console.
The rendering itself is fine, otherwise Mermaid graphs wouldn't be shown in the preview window.
---
### Author:  [@Daeraxa](https://discourse.joplinapp.org/u/Daeraxa)
#### Post date: [19 December 2021 00:52 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/9 "2021-12-19T00:52:51Z")
That one is a slightly different issue that has been solved, it is a Linux specific case sensitivity issue that didn't affect Windows or macOS
---
### Author:  [@graphit0](https://discourse.joplinapp.org/u/graphit0)
#### Post date: [19 December 2021 01:02 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/10 "2021-12-19T01:02:25Z")
As temporary workaround until the release with the fix is published, you can enable safe mode and do the export.
Also HTML directory export is unaffected by the issue on Windows and Linux (I don't have a Mac), so I suppose we can wait a bit till the new release.
The published issue on GitHub for further tracking
>
>
> PDF and HTML File export of mermaid renders stopped working on 2.6.9 and shows u…p as plain code
>
> !\[image\_2021-12-18\_23-45-34\](https://user-images.githubusercontent.com/44114323/146658923-6ddcfeb2-204f-4969-afb8-b1ad3404acdf.png)
>
> \## Environment
>
> Joplin version: 2.6.9
> First appears at 2.6.4: 2.6.2 is unaffected
> wonder if commit 98ed2be518d2d390199e18ae8a25a8882a8eacff might have something to do with it
> Platform: prod, win32; prod, linux is untested
> OS specifics: Tested on Windows 7, \[reported on Mac OS 12.0.1\](https://discourse.joplinapp.org/t/mermaid-rendering/22456?u=graphit0) as well
>
>
> \## Steps to reproduce
>
> 1. Create a note
> 2. paste mermaid graph
> \`\`\`mermaid
> flowchart TD
> a --- b
> \`\`\`
> 3. Export the note as PDF or HTML File
> 4. Open the note and see unrendered mermaid code
>
> \## Describe what you expected to happen
> The rendered graph to be present in exported document
>
> \## Notes
> \- PlantUML, katex, tables, checkboxes, etc are unaffected
> \- Mermaid graphs render fine in the Joplin view mode
> \- HTML Directory export seems to be unaffected
>
>
> \## Logfile
> \`\`\`
> Export HTML result:
> {warnings: Array(0)}
> warnings: \[\]
> \[\[Prototype\]\]: Object
> constructor: ƒ Object()
> hasOwnProperty: ƒ hasOwnProperty()
> isPrototypeOf: ƒ isPrototypeOf()
> propertyIsEnumerable: ƒ propertyIsEnumerable()
> toLocaleString: ƒ toLocaleString()
> toString: ƒ toString()
> valueOf: ƒ valueOf()
> \_\_defineGetter\_\_: ƒ \_\_defineGetter\_\_()
> \_\_defineSetter\_\_: ƒ \_\_defineSetter\_\_()
> \_\_lookupGetter\_\_: ƒ \_\_lookupGetter\_\_()
> \_\_lookupSetter\_\_: ƒ \_\_lookupSetter\_\_()
> \_\_proto\_\_: (...)
> get \_\_proto\_\_: ƒ \_\_proto\_\_()
> set \_\_proto\_\_: ƒ \_\_proto\_\_()
> \`\`\`
---
### Author:  [@fisher](https://discourse.joplinapp.org/u/fisher)
#### Post date: [19 December 2021 01:17 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/11 "2021-12-19T01:17:56Z")
I see the folder name discrepancy now. Sticking to 2.6.2 until the new version. Thanks!
---
### Author:  [@hieuthi](https://discourse.joplinapp.org/u/hieuthi)
#### Post date: [19 December 2021 02:45 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/12 "2021-12-19T02:45:33Z")
I have a theory on why Mermaid has this issue. I have been following a couple of printing/pdf issue but haven't had time to check on them comprehensively yet. It seems there are multiple problems that causes printing issue for multiple different things but for mermaid specifically the reason might be that webkit never call onload on several events you expect it to call.
I discover this problem while develop several plugins that do "rendering" on the javascript side instead of markdown side. There is a hack for that of course, I will check if it will fix mermaid problem when I have some time for that.
---
### Author:  [@tessus](https://discourse.joplinapp.org/u/tessus)
#### Post date: [19 December 2021 02:56 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/13 "2021-12-19T02:56:31Z")
The thing is this worked fine before, so it must be a regression. I suspect that we removed something that made it work previously.
Or do you think it was always by chance that it worked before? But hey, everything is possible with Electron.
Update: When I have a bit more time I will run a `git bisect` session to find the offending commit.
---
### Author:  [@Daeraxa](https://discourse.joplinapp.org/u/Daeraxa)
#### Post date: [19 December 2021 03:17 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/14 "2021-12-19T03:17:44Z")
It is broken in the same commit as the other issue, the html pack commit - [Desktop, CLI: When exporting as HTML, pack all images, styles and scr… · laurent22/joplin@98ed2be · GitHub](https://github.com/laurent22/joplin/commit/98ed2be518d2d390199e18ae8a25a8882a8eacff)
I did a highly unscientific test and just replaced the entirety of the `InteropService_Exporter_Html.ts` file with the one from the 2.6.2 commit and it exports the graph.
Edit:
Did some more playing and got rid of just the last function and got the graph back, so it is something in there or something that it calls upon.
(commented out the whole last `public async close()` function and change it to just `async close() {}`)
Another edit:
Changed this line (line 35 of the same file) to false and it works again - because it then bypasses that function I identified before.
`this.packIntoSingleFile_ = 'packIntoSingleFile' in options ? options.packIntoSingleFile : false;`
Is there a reason why exporting to PDF needs to go via the additional code added for the HTML single file packing? The change notes imply this should only fire for exporting as a single HTML.
Either way I'll copy this post to the github issue just in case people only look at one of the two
---
### Author:  [@tessus](https://discourse.joplinapp.org/u/tessus)
#### Post date: [19 December 2021 05:01 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/15 "2021-12-19T05:01:49Z")
We should probably just use the gh issue to discuss the bug and then post the final solution to this topic, otherwise it get's a bi complicated.... 😉
---
### Author:  [@system](https://discourse.joplinapp.org/u/system)
#### Post date: [18 January 2022 05:02 UTC](https://discourse.joplinapp.org/t/mermaid-rendering/22456/16 "2022-01-18T05:02:02Z")
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.