dendron icon indicating copy to clipboard operation
dendron copied to clipboard

Mermaid mindmap diagram not getting rendered in the preview

Open thealokkr opened this issue 1 year ago • 3 comments

Please select the area your bug applies to. (Multiple selections are Possible. You can leave blank if you're not sure.)

  • [ ] Workspace. VSCode workspace, vaults, Intellisense/autocomplete, Dendron settings
  • [ ] Lookup. Dendron's Lookup Command
  • [ ] Views. Dendron Preview, Tree View, Side Panels in the UI
  • [ ] Schema. Dendron Schemas
  • [ ] Pod. Data import from / export to Dendron
  • [ ] Publish. External Site Publish
  • [x] Markdown. Markdown features, such as syntax support and features

Describe the bug

Mermaid mindmap diagrams are not getting rendered in the preview. The same mindmap snippet is working fine in the online editor

To Reproduce

Steps to reproduce the behavior:

  1. Add the following snippet to a markdown file

mindmap root((mindmap)) Origins Research Tools

3. Click on the Dendron toggle preview
4. The preview shows - Syntax error in graph mermaid version 9.1.3
 
## Expected behavior
1. The mindmap diagram must be rendered in the preview. The same snippet is working fine in the online mermaid editor (https://mermaid.live/edit#pako:eNotT8sKwjAQ_JWyJ4Uqba195OxVBPUkuSzNqoEmW9IU1NJ_N7be5rE7w4zQsCIQYLRVBjtpo8gx-9XqL6zXPymKTk4_tO0Xcqae0DXPhV2Z22BADIacQa1C3PizJPgnGZIgAlR0x6H1EqSdwikOni9v24DwbqAYhk6hp4PGh0MD4o5tH9QOLYgRXiDqZFsmRZlW-zqtyqwqYniD2OTbPMmTrE6LLC92-90Uw4c5BKTz823GSwMp7dkdl7nz6ukLblhPQg)

## Screenshots

Dendron preview result
<img width="419" alt="image" src="https://user-images.githubusercontent.com/7398429/231072058-47239bea-27ed-48c9-a612-95e48d3c52d5.png">

Mermaid online editor view
<img width="636" alt="image" src="https://user-images.githubusercontent.com/7398429/231072374-c3b16559-3957-4a26-bce8-668d3ec79d4e.png">
## Desktop (please complete the following information)

- OS: [macOS Monterery]
- Browser (Chrome]
- Versions (all that apply to bug):
  - Dendron Extension: Mermaid
  - VS Code version: 1.77.1
  - Dendron CLI: v0.119.0

## Additional context

Add any other context about the problem here.

## Dendron Log file

Please attach the output of `> Dendron:Dev: Open Logs` here

thealokkr avatar Apr 11 '23 06:04 thealokkr

Hi - any update on that? Thanks loads

e5k avatar Aug 22 '23 12:08 e5k

I believe this issue is related to the mermaid plugin moving to ESM earlier this year, which based on what I can find is not supported (at least as of last comments on this thread: https://github.com/orgs/mermaid-js/discussions/4148) by electron, which is what VS Code is built on. If there is a fix, it sounds like a non-trivial update to the VS Code plugin.

shyft-eric avatar Aug 22 '23 18:08 shyft-eric

Thanks @shyft-eric. Bummer!

e5k avatar Aug 22 '23 18:08 e5k