fix(web-ui): sanitize mermaid SVG output before HTML injection (light-tested) - #2611
Open
1688mengdie wants to merge 1 commit into
Open
fix(web-ui): sanitize mermaid SVG output before HTML injection (light-tested)#26111688mengdie wants to merge 1 commit into
1688mengdie wants to merge 1 commit into
Conversation
Mermaid is configured with securityLevel: 'loose', so diagram labels may carry raw HTML through rendering. The rendered SVG was passed straight into dangerouslySetInnerHTML, letting a crafted diagram execute scripts, abuse on* event handlers, or navigate via javascript: URLs. Add sanitizeMermaidSvg.ts: an allowlist-based DOM sanitizer that keeps the structural SVG and text-container elements a rendered diagram needs while stripping script/iframe/object-style elements, on* handler attributes, and javascript:/vbscript:/data:text-html URL schemes. Wire it into MermaidBlock so only sanitized markup reaches the DOM, and cover the XSS vectors (script, on* handlers, unsafe URLs, foreignObject payloads) plus normal-diagram rendering in tests. Test: pnpm --dir src/web-ui run type-check; pnpm --dir src/web-ui run lint; vitest run MermaidBlock.test.tsx (6 passed); Markdown/MarkdownEditor regression suites (16 passed). AI: AI-assisted, locally tested (type-check + lint + targeted vitest).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Mermaid diagrams render with
securityLevel: 'loose', so diagram labelsmay carry raw HTML that survives rendering.
MermaidBlockpassed therendered SVG straight into
dangerouslySetInnerHTML, letting a crafteddiagram execute scripts, abuse
on*event handlers, or navigate viajavascript:URLs inside the renderer context.This PR adds
sanitizeMermaidSvg.ts, an allowlist-based DOM sanitizerthat keeps the structural SVG and text-container elements a rendered
diagram needs while stripping
script/iframe/object-style elements,on*handler attributes, andjavascript:/vbscript:/data:text-htmlURL schemes. The rendered output is sanitized before it reaches the DOM,
and the XSS vectors (script injection,
on*handlers, unsafe URLs,foreignObjectpayloads) plus normal-diagram rendering are covered bytests.
Fixes #2602
Type and Areas
Type: security fix
Areas: Web UI
Verification
pnpm --dir src/web-ui run type-check— passed (0 errors).pnpm --dir src/web-ui run lint— passed (0 errors).vitest run MermaidBlock.test.tsx— 6 passed (new sanitizer test suite: XSS vectors + normal rendering).vitest run Markdown.test.tsx MarkdownEditor.test.tsx— 16 passed (existing Markdown render regression suites, no behavior change).Reviewer Notes
MermaidBlock.tsx, test file).Checklist
This is an AI-assisted change.