dotnet / interactive

.NET Interactive combines the power of .NET with many other languages to create notebooks, REPLs, and embedded coding experiences. Share code, explore data, write, and learn across your apps in ways you couldn't before.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

More than one Mermaid Diagram does not render properly on Export to HTML or PDF

drewsteinacher opened this issue · comments

Describe the bug

When exporting an .ipynb to HTML or PDF with multiple Mermaid cells, only one appears to render properly, and the remainder appear as generic error messages like "Syntax error in text mermaid version 10.6.1":
image

For example, use this mermaid code in two cells in a .ipynb notebook:

sequenceDiagram
      Alice->>John: Hello John
      John-->>Alice: Great day!
Loading

image

You may need to have the following set up to get to the Export button:
image

  1. A Python environment installed with nbconvert installed (you may need to run pip install nbconvert as mentioned here).
  2. The Python VSCode extension installed and configured to the correct environment.

Some other related information:

  • Using a different version of mermaid-js might solve it per this issue
  • I have reproduced this on Windows 10 and Ubuntu.

Please complete the following:

Which version of .NET Interactive are you using? (In a notebook, run the #!about magic command. ):

  • OS
    • Windows 11
    • Windows 10
    • macOS
    • Linux (Please specify distro: Ubuntu)
    • iOS
    • Android
  • Browser
    • Chrome
    • Edge
    • Firefox
    • Safari
  • Frontend
    • Jupyter Notebook
    • Jupyter Lab
    • nteract
    • Visual Studio Code
    • Visual Studio Code Insiders
    • Visual Studio
    • Other (please specify)

Screenshots

If applicable, add screenshots to help explain your problem.