Mermaid-Chart / vscode-mermaid-preview

Previews Mermaid diagrams
MIT License
142 stars 15 forks source link

Does not render #72

Closed tgdn closed 5 years ago

tgdn commented 5 years ago

New file with mermaid code within it > "Preview on Mermaid" > opens the preview pane and I put my cursor on it, but nothing happens as can be seen in the screenshot below.

Tried multiple times with different code.

The dev console logs:

[Embedded Page] Uncaught TypeError: Cannot read property 'setAttribute' of null
webviewElement.ts:392

macOS Mojave VS Code: Version 1.33.1 (1.33.1) Mermaid Preview: v0.11.2

Expected behaviour

graph TD
    Start --> Stop

Actual behaviour

image

vstirbu commented 5 years ago

You have to use .mmd file extension if the diagram is not embedded in a markdown document.

tgdn commented 5 years ago

Still doesn't work

vstirbu commented 5 years ago

What do you get in the log after adding the mmd extension? Alternatively can you see the diagram if the diagram is embedded in a markdown document?

tgdn commented 5 years ago

When I use the mdd extension I have the same exception:

[Embedded Page] Uncaught TypeError: Cannot read property 'setAttribute' of null

However, when I embed the mermaid code within markdown it works, but most then the text cannot be seen as it's dark on dark.

image

vstirbu commented 5 years ago

The extension for stand alone mermaid is mmd. You mentioned mdd. Is that a typo?

The styling comes from mermaid. The plugin does not change that. If there are any issues with the styling (e.g. not visible with dark theme), you should bring it to their attention as most likely the problem exists in other environments where dark mode is used.

Alternatively, you have the option to provide a custom theme.

tgdn commented 5 years ago

Yes that's a typo sorry. .mmd is the extension I tried which gave a blank preview.

Thank you I'll just use markdown with a different theme.