diff --git a/cypress/integration/rendering/flowchart.spec.js b/cypress/integration/rendering/flowchart.spec.js
index 06c84ac2ef..2c20090a49 100644
--- a/cypress/integration/rendering/flowchart.spec.js
+++ b/cypress/integration/rendering/flowchart.spec.js
@@ -512,7 +512,7 @@ describe('Flowchart', () => {
);
});
- it('24: Keep node label text (if already defined) when a style is applied', () => {
+ it('24.1: Keep node label text (if already defined) when a style is applied', () => {
imgSnapshotTest(
`graph LR
A(( )) -->|step 1| B(( ))
@@ -524,6 +524,25 @@ describe('Flowchart', () => {
{ flowchart: { htmlLabels: false } }
);
});
+it('24.2: Handle link click events (link, anchor, mailto, other protocol, script)', () => {
+ imgSnapshotTest(
+ `graph TB
+ TITLE["Link Click Events
(click the nodes below)"]
+ A[link test]
+ B[anchor test]
+ C[mailto test]
+ D[other protocol test]
+ E[script test]
+ TITLE --> A & B & C & D & E
+ click A "https://mermaid-js.github.io/mermaid/#/" "link test"
+ click B "#link-clicked" "anchor test"
+ click C "mailto:user@user.user" "mailto test"
+ click D "notes://do-your-thing/id" "other protocol test"
+ click E "javascript:alert('test')" "script test"
+ `,
+ { securityLevel: 'loose' }
+ );
+ });
it('25: Set node text color according to style when html labels are enabled', () => {
imgSnapshotTest(
diff --git a/dist/index.html b/dist/index.html
index 9df88224ed..47293b4b6f 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -353,6 +353,22 @@
linkStyle 1 stroke:greenyellow,stroke-width:2px
style C fill:greenyellow,stroke:green,stroke-width:4px
+