[PR #13792] fix: replace old-style <br> tags to fix Mermaid rendering issues #28038

Closed
opened 2026-02-21 20:42:41 -05:00 by yindo · 0 comments
Owner

Original Pull Request: https://github.com/langgenius/dify/pull/13792

State: closed
Merged: Yes


Summary

Fixes #13481 to ensure Mermaid renders correctly when the code contains <br> tags. The Mermaid Live Editor also does the same thing to ensure the exported SVG file is valid (see here).

Tip

Close issue syntax: Fixes #<issue number> or Resolves #<issue number>, see documentation for more details.

Screenshots

Before After Mermaid Code
rendered-flowchart-before rendered-flowchart-after See Code 1 below
rendered-flowchart-with-newline-before rendered-flowchart-with-newline-after See Code 2 below

Code 1

graph TD
    A[Start<br>Initialization] --> B{Condition?};
    B -- Yes --> C[Process A<br>Update Value];
    B -- No --> D[Process B<br>Skip Step];
    C --> E[End];
    D --> E;

Code 2

flowchart TD
    A[Christmas] -->|Get money| B(Go shopping)
    B --> C{Let me
 think}
    C -->|One| D[Laptop]
    C -->|Two| E[iPhone]
    C -->|Three| F[fa:fa-car Car]

Checklist

Important

Please review the checklist below before submitting your pull request.

  • This change requires a documentation update, included: Dify Document
  • I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!)
  • I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change.
  • I've updated the documentation accordingly.
  • I ran dev/reformat(backend) and cd web && npx lint-staged(frontend) to appease the lint gods
**Original Pull Request:** https://github.com/langgenius/dify/pull/13792 **State:** closed **Merged:** Yes --- # Summary Fixes #13481 to ensure Mermaid renders correctly when the code contains `<br>` tags. The Mermaid Live Editor also does the same thing to ensure the exported SVG file is valid (see [here](https://github.com/mermaid-js/mermaid-live-editor/blob/9a70c08a6f6592f00c1307a1f66ca9a45b8d0f41/src/lib/components/Actions.svelte#L32)). > [!Tip] > Close issue syntax: `Fixes #<issue number>` or `Resolves #<issue number>`, see [documentation](https://docs.github.com/en/issues/tracking-your-work-with-issues/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword) for more details. # Screenshots | Before | After | Mermaid Code | |--------|-------|-------| | ![rendered-flowchart-before](https://github.com/user-attachments/assets/a486fe8d-c1e9-4d0d-8436-640b41c6cb4d) | ![rendered-flowchart-after](https://github.com/user-attachments/assets/2d900e58-fe68-4452-ace2-8ea1f75edb80) | See Code 1 below | | ![rendered-flowchart-with-newline-before](https://github.com/user-attachments/assets/c6ad989d-cb90-4293-a248-9ed8e4a85c16) | ![rendered-flowchart-with-newline-after](https://github.com/user-attachments/assets/f32a90f2-d4aa-4632-8e63-5e7260694195) | See Code 2 below | ## Code 1 ``` graph TD A[Start<br>Initialization] --> B{Condition?}; B -- Yes --> C[Process A<br>Update Value]; B -- No --> D[Process B<br>Skip Step]; C --> E[End]; D --> E; ``` ## Code 2 ``` flowchart TD A[Christmas] -->|Get money| B(Go shopping) B --> C{Let me think} C -->|One| D[Laptop] C -->|Two| E[iPhone] C -->|Three| F[fa:fa-car Car] ``` # Checklist > [!IMPORTANT] > Please review the checklist below before submitting your pull request. - [ ] This change requires a documentation update, included: [Dify Document](https://github.com/langgenius/dify-docs) - [x] I understand that this PR may be closed in case there was no previous discussion or issues. (This doesn't apply to typos!) - [x] I've added a test for each change that was introduced, and I tried as much as possible to make a single atomic change. - [x] I've updated the documentation accordingly. - [x] I ran `dev/reformat`(backend) and `cd web && npx lint-staged`(frontend) to appease the lint gods
yindo added the pull-request label 2026-02-21 20:42:41 -05:00
yindo closed this issue 2026-02-21 20:42:41 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: langgenius/dify#28038