Apr 25, 2026·4 min read·6 visits
DOM-based XSS in Excalidraw resulting from un-sanitized KaTeX label rendering in the upstream Mermaid engine.
Excalidraw suffers from a DOM-based Cross-Site Scripting (XSS) vulnerability caused by an upstream flaw in the Mermaid diagramming library. The issue occurs during the dimension calculation of KaTeX-rendered labels, leading to arbitrary JavaScript execution when a malicious diagram is rendered in the browser.
The @excalidraw/excalidraw library contains a DOM-based Cross-Site Scripting (XSS) vulnerability. This flaw allows an attacker to execute arbitrary JavaScript in the context of the application hosting the Excalidraw component.
The vulnerability originates from an upstream dependency flaw tracked as CVE-2025-54881 and GHSA-7rqq-prvp-x9jh. Excalidraw uses the @excalidraw/mermaid-to-excalidraw package to parse and render Mermaid diagram definitions.
Because Excalidraw relies on the Mermaid engine to calculate element dimensions during this conversion process, it inherits the insecure rendering pipeline present in vulnerable versions of Mermaid. This chain of trust allows malicious diagram definitions to compromise the host application.
The root cause of this vulnerability lies in the calculateMathMLDimensions function within the Mermaid engine. This function resides in the packages/mermaid/src/diagrams/common/common.ts file and is responsible for measuring the physical dimensions of text labels containing mathematical expressions.
The function receives raw text input from the diagram definition and passes it to the renderKatex function. The renderKatex function processes LaTeX delimiters but fails to sanitize the surrounding HTML context.
The resulting string is directly assigned to the innerHTML property of a dynamically created div element. This element is subsequently appended to the document.body to calculate its rendered size. This specific sequence of operations creates a classic DOM-based XSS sink.
The vulnerable implementation processes untrusted input directly into a DOM sink without prior sanitization. The innerHTML assignment forces the browser to parse and execute any malicious payload embedded in the diagram label.
export const calculateMathMLDimensions = (text: string, config: MermaidConfig) => {
text = renderKatex(text, config); // Processes math but does not sanitize HTML
const divElem = document.createElement('div');
divElem.innerHTML = text; // DANGEROUS SINK
divElem.id = 'katex-temp';
document.body.appendChild(divElem); // Browser executes the payload here
// Measurement logic follows
};The upstream patch addresses this by refactoring the rendering pipeline to be asynchronous and introducing strict sanitization. The sanitization step uses DOMPurify to strip dangerous HTML tags and attributes before the string reaches the DOM sink.
// Patched implementation uses an asynchronous pipeline and DOMPurify
export const calculateMathMLDimensions = async (text: string, config: MermaidConfig) => {
text = await renderKatexSanitized(text, config); // Input is now sanitized
const divElem = document.createElement('div');
divElem.innerHTML = text; // SAFE SINK
// ...
};Exploitation requires the attacker to supply a crafted Mermaid diagram definition to an application utilizing the vulnerable Excalidraw component. The payload must include valid KaTeX delimiters to trigger the vulnerable code path.
The attacker constructs a label within a supported diagram type, such as a sequence diagram, containing a malicious HTML element. An image tag with an onerror event handler is highly reliable for this purpose.
When the victim attempts to view or convert the diagram, Excalidraw invokes the Mermaid parsing engine. The engine processes the label, reaches the innerHTML assignment, and executes the embedded JavaScript within the victim's browser session.
Successful exploitation grants the attacker the ability to execute arbitrary JavaScript within the security context of the victim's browser session. The severity of this execution depends entirely on the privileges and data accessible to the hosting application.
An attacker can access sensitive data stored in localStorage, sessionStorage, or non-HttpOnly cookies. This access frequently leads to session hijacking and unauthorized account access.
Furthermore, the injected script can perform arbitrary actions on behalf of the user by interacting with the application's APIs. In a collaborative environment like Excalidraw, the attacker could silently modify diagrams, exfiltrate proprietary designs, or pivot to attack other users viewing the same document.
Remediation requires updating the @excalidraw/excalidraw dependency to version 0.18.1 or later. This release updates the @excalidraw/mermaid-to-excalidraw package to version 1.1.1, which contains the secure upstream Mermaid implementation.
If the application uses @excalidraw/mermaid-to-excalidraw independently of the main Excalidraw package, developers must ensure it is updated to at least version 1.1.1 or the 2.0.0 branch.
Applications should also enforce strict Content Security Policy (CSP) headers to restrict script execution and limit the impact of potential XSS vulnerabilities. Disabling inline scripts prevents the execution of event handler payloads used in this exploit.
| Product | Affected Versions | Fixed Version |
|---|---|---|
@excalidraw/excalidraw Excalidraw | <= 0.18.0 | 0.18.1 |
@excalidraw/mermaid-to-excalidraw Excalidraw | < 1.1.1 | 1.1.1 |
mermaid Mermaid | < 10.9.4 | 10.9.4 |
| Attribute | Detail |
|---|---|
| CWE ID | CWE-79 |
| Attack Vector | Network / Client-Side |
| Vulnerability Type | DOM-based Cross-Site Scripting (XSS) |
| Exploit Status | Proof of Concept Available |
| Upstream Root Cause | CVE-2025-54881 |
| Affected Sink | innerHTML within calculateMathMLDimensions |