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

[drewsteinacher]

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":

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

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

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

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
  • [x] Windows 10
  • [ ] macOS
  • [x] Linux (Please specify distro: Ubuntu)
  • [ ] iOS
  • [ ] Android
  • Browser
  • [ ] Chrome
  • [ ] Edge
  • [x] Firefox
  • [ ] Safari
  • Frontend
  • [ ] Jupyter Notebook
  • [ ] Jupyter Lab
  • [ ] nteract
  • [x] Visual Studio Code
  • [ ] Visual Studio Code Insiders
  • [ ] Visual Studio
  • [ ] Other (please specify)

Screenshots

If applicable, add screenshots to help explain your problem.