| Package | Affected versions | Patched versions |
|---|---|---|
| mermaid | ≥ 11.0.0-alpha.1, < 11.15.0< 10.9.6 | 11.15.010.9.6 |
The state diagram and any other diagram type that routes user-controlled style strings through createCssStyles parser for Mermaid v11.14.0 and earlier captures classDef values with an unrestricted regex:
// packages/mermaid/src/diagrams/state/parser/stateDiagram.jison:83
<CLASSDEFID>[^\n]* { this.popState(); return 'CLASSDEF_STYLEOPTS' }
The value passes unsanitized through addStyleClass() -> createCssStyles() -> style.innerHTML (mermaidAPI.ts:418). A } in the value closes the generated CSS selector, and everything after becomes a new CSS rule on the page.
stateDiagram-v2
classDef x }*{ background-image: url("http://media.giphy.com/media/SggILpMXO7Xt6/giphy.gif")}
This has been patched in:
Setting "securityLevel": "sandbox" will prevent this, by rendering the mermaid diagram in a sandboxed <iframe>.
Enables page defacement, user tracking via url() callbacks, and DOM attribute exfiltration via CSS :has() selectors.
Running one of these products? Scan your site to see whether it exposes a vulnerable version.
Scan my site free