Skip to content

Markdown preview fails to render Mermaid in VS Code 1.121.0 when using mermaid-chart extension (v2.6.6) #126

@syuuha

Description

@syuuha

[Description]:

After upgrading to VS Code 1.121.0, Mermaid diagrams in Markdown files are not displayed in the preview panel.
However, I noticed that if I edit the Markdown source code (e.g., type any character inside the code block), the Mermaid preview suddenly renders correctly.

Without mermaidchart.vscode-mermaid-chart extension installed, everything works correctly.

[Steps to reproduce]:

  1. Install VS Code 1.121.0
  2. Install the extension mermaidchart.vscode-mermaid-chart v2.6.6
  3. Create a Markdown file with two Mermaid diagram code block
  4. Open the Markdown preview
  5. Observe that the Mermaid diagram is not rendered
  6. Type any character inside the Mermaid code block in the source editor
  7. Observe that the preview now shows the diagram correctly

[Expected behavior]:
The Mermaid diagram should render immediately without needing to modify the source code.

[Screenshots]:

Initial broken preview
Image

Preview after typing in source code
Image

[Environment]:
VS Code version: 1.121.0
Extension: mermaidchart.vscode-mermaid-chart (v2.6.6)

[Note]:
VS Code 1.121.0 introduced a built-in extension called "Mermaid Markdown Features" that adds native Mermaid support. This may be causing a conflict with the third-party Mermaid extension.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions