Switch Mermaid renderer and fix tab rendering#2659
Draft
theletterf wants to merge 14 commits intomainfrom
Draft
Conversation
Render Mermaid only after tab activation to avoid hidden layout errors and speed first render. Add Jest coverage and a simple intro diagram example. Co-authored-by: GPT 5.2 Codex (Cursor) <gpt-5.2-codex@cursor> Co-authored-by: Cursor <cursoragent@cursor.com>
Swap dependencies to use MermaidJS instead of Beautiful Mermaid. Co-authored-by: Cursor <cursoragent@cursor.com>
…as HTML Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
🔍 Preview links for changed docs |
DOMPurify's SVG profile strips <foreignObject> elements that Mermaid uses for text labels, and combining svg+html profiles returns an empty string entirely. Replace DOMPurify with lightweight regex sanitisation that removes <script> tags and on* event handlers while preserving the full SVG structure including foreignObject/XHTML content. Co-authored-by: Claude Opus 4 <noreply@anthropic.com> Co-authored-by: Cursor <cursoragent@cursor.com>
Replace regex-based script/event-handler stripping with DOMParser + XMLSerializer. This addresses three CodeQL findings: - Bad HTML filtering regexp (#56): regex missed </script > variants - Incomplete multi-character sanitization (#57): nested on* attrs - DOM text reinterpreted as HTML (#55): regex not robust enough Also route the fullscreen modal SVG through sanitizeSvg. Co-authored-by: Claude Opus 4 <noreply@anthropic.com> Co-authored-by: Cursor <cursoragent@cursor.com>
Return a DOM Node from sanitizeSvgNode instead of a serialised string and use appendChild rather than innerHTML. This eliminates the "DOM text reinterpreted as HTML" alerts (#55, #59) since no string is ever assigned to innerHTML for diagram content. Co-authored-by: Claude Opus 4 <noreply@anthropic.com> Co-authored-by: Cursor <cursoragent@cursor.com>
…ring Co-authored-by: Cursor <cursoragent@cursor.com> # Conflicts: # src/Elastic.Documentation.Site/package.json
Co-authored-by: GPT 5.2 Codex (Cursor) <noreply@cursor.com> Co-authored-by: Cursor <cursoragent@cursor.com>
The strict XML parser (image/svg+xml) rejects void elements like <br> inside <foreignObject> that Mermaid uses for text labels. Switching to text/html uses the lenient HTML parser which handles these correctly. Co-authored-by: GPT 5.2 Codex (Cursor) <noreply@cursor.com> Co-authored-by: Cursor <cursoragent@cursor.com>
Contributor
Author
|
Trying with a different approach. |
…ample - Bumps mermaid from 11.12.2 to 11.12.3. - Sets Mermaid theme to 'neutral' in initialize config. - Replaces the Painless Operators complex flowchart with a multi-tenant Azure architecture diagram showcasing nested subgraphs, per-subgraph direction overrides, and the hidden spacer node pattern. Co-authored-by: Claude <claude@anthropic.com> Made-with: Cursor
reakaleek
approved these changes
Mar 3, 2026
- Keep standard mermaid dependency, drop @theletterf/beautiful-mermaid. - Take lodash ^4.17.23 from main (newer patch). - Drop beautiful-mermaid color/icon constants from mermaid.ts. - Keep Azure architecture diagram as the complex flowchart example. - Deduplicate intro diagram (keep main's descriptive version). Co-authored-by: Claude <claude@anthropic.com> Made-with: Cursor
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
neutral.mermaidto11.12.3.docs/syntax/diagrams.mdwith a multi-tenant Azure architecture diagram showcasing nested subgraphs, per-subgraph direction overrides, and the hidden spacer node pattern.Made with Cursor