[SUPPORT] Mermaid diagrams script: theme configuration for sequenceDiagram

[ivanpustogarov]

Script name

Mermaid Diagrams

Script authors

"@dohliam", "@cyclops1982"

Expected behavior

Diagram of type sequenceDiagram with "forest" theme (green) is shown in the preview pane.

Actual behavior

Diagram is not shown at all.

Steps to reproduce

1) Add the following to qownnotes:

```mermaid
%%{init: {'theme':'forest'}}%%
sequenceDiagram
    Alice->>+John: Hello John, how are you?
    Alice->>+John: John, can you hear me?
    John-->>-Alice: Hi Alice, I can hear you!
    John-->>-Alice: I feel great!

2) Switch to preview (and no image is displayed)

Debugging:

I inserted the generated URL to the browser and it returned "Not Found".

https://mermaid.ink/img/JSV7aW5pdDogeyd0aGVtZSc6J2ZvcmVzdCd9fSUlCnNlcXVlbmNlRGlhZ3JhbQogICAgQWxpY2UtPj4rSm9objogSGVsbG8gSm9obiwgaG93IGFyZSB5b3U/CiAgICBBbGljZS0+PitKb2huOiBKb2huLCBjYW4geW91IGhlYXIgbWU/CiAgICBKb2huLS0+Pi1BbGljZTogSGkgQWxpY2UsIEkgY2FuIGhlYXIgeW91IQogICAgSm9obi0tPj4tQWxpY2U6IEkgZmVlbCBncmVhdCE=

However the following works (with added new line):

%%{init: {'theme':'forest'}}%%
sequenceDiagram
    Alice->>+John: Hello John, how are you?
    Alice->>+John: John, can you hear me?
    John-->>-Alice: Hi Alice, I can hear you!
    John-->>-Alice: I feel great!

Seems like more a mermaid ink bug rather than this script's. Adding this in case someone else encouters the same issue.

[pbek]

So is that an issue of https://mermaid.ink/?

[pbek]

Maybe just adding a newline in front of the string diag helps:

https://github.com/qownnotes/scripts/blob/da580f91978d3979c6e4de1b8560a75c4ef9a75d/mermaid/mermaid.qml#L23

[ivanpustogarov]

Yes, it's a mermaid's issue. I probably shoulld submit an issue with them. In their python example, they have a new line: https://github.com/mermaid-js/mermaid/issues/1791.

On the other note, I just found that a single space (instead of a new line) before %%{init: {'theme':'forest'}}%% also works.

[ivanpustogarov]

I think it's a very narrow issue for this script as of now: a) the default theme works; b) non-default theme problem is due to mermaid ink API; c) the issue is only for a specfic type of diagram; d) there is a simple work-around.

Also maybe adding a new line/space in this script will break something else.

I will submit the issue with mermaid ink API and close this one?

[pbek]

I will submit the issue with mermaid ink API and close this one?

Yes and yes, I guess opening an issue there would be best!

[ivanpustogarov]

kk!