mermaid-preview says flowchart diagram is invalid

[HolisticDeveloper]

I've just tried mermaid-preview for the first time. It doesn't seem to support the flowchart diagram. I've used the following sample diagram from Mermaid.live:

flowchart TD
    A[Christmas] -->|Get money| B(Go shopping)
    B --> C{Let me think}
    C -->|One| D[Laptop]
    C -->|Two| E[iPhone]
    C -->|Three| F[fa:fa-car Car]

I get a message back that says "Mermaid diagram is invalid."

[JackuB]

Thanks for the report! I'll add it to the test suite. Indeed it's failing for the same issue as here: https://github.com/mermaid-js/mermaid/issues/5204

I'll check if there is a way to get it working.

[JackuB]

Hey, I updated the app to handle the validation. And the chart now gets rendered 👌

However, there is still an issue with Font-Awesome icons clipping text in boxes: https://github.com/mermaid-js/mermaid-cli/issues/539 can't see a solution to this one 🤔

[HolisticDeveloper]

Works for me! Personally I haven't use font-awesome icons a lot, although it does seem like they would be handy.

[JackuB]

Good news, with the https://github.com/mermaid-js/mermaid-cli/releases/tag/10.9.0 the icon font is correctly rendered.