An unofficial way making the sequence chart interactive?

[pavlo]

Currently there is no official way to make a sequence chart interactive, meaning you can not make a message clickable, for instance.

I was wondering if there's an unofficial way to achieve that? Is there a walk-around or a trick to make the interactivity happen?

Thanks guys for the excellent product!
Pavlo

[knsv]

Not as of now but it makes sense to add interaction there as a means to divide large sequence diagrams into smaller pieces. Stay tuned. @edumicse, what do you think?

[edumicse]

Sounds tempting @knsv.

[yongchaoo]

try this:
html:

  <div class="mermaid" id="diagram">
        sequenceDiagram
        Alice->>John: Hello John, how are you?
   </div>

js:

      document.getElementById("diagram").addEventListener("click", e => {
            // get messageText
            if (e.srcElement.className.baseVal === 'messageText') {
                const textContent = e.srcElement.textContent;
                console.log(textContent);
            }
            // do something
        });

[jgreywolf]

This is the same underlying issue as #1139 - interactions were not added to these diagrams when originally created.

If anyone wants to take this work on, look at how interactions are handled in flowchart/class diagrams

[jgreywolf]

Closing this in favor of #1279