Code Block Distorts Content in WebApp (e.g., Regex Expressions)

[XiaoLey]

Self Checks

• [x] This is only for bug report, if you would like to ask a question, please head to Discussions.
• [x] I have searched for existing issues search for existing issues, including closed ones.
• [x] I confirm that I am using English to submit this report (我已阅读并同意 Language Policy).
• [x] [FOR CHINESE USERS] 请务必使用英文提交 Issue，否则会被关闭。谢谢！:)
• [x] Please do not modify this template :) and fill in all the required fields.

Dify version

1.1.1

Cloud or Self Hosted

Self Hosted (Docker)

Steps to reproduce

I have encountered a bug in the Dify WebApp where certain content, like specific regex expressions, becomes distorted when wrapped in a code block. Some characters are altered, which makes the content different from the original. For example, I noticed this with the following regex: ^\(server.*\)/[^/]*$.

When placed inside a code block, some characters are either misinterpreted or replaced. This behavior affects the accuracy of the content, which is crucial for code snippets or technical information.

Steps to Reproduce:

1. Compose a prompt to include the regex ^\(server.*\)/[^/]*$ inside a code block.
2. Send this prompt through the WebApp to a model.
3. Review the rendered content in the code block either in the WebApp output or the model's response.
4. Notice that the content has been altered from the original.

✔️ Expected Behavior

No response

❌ Actual Behavior

No response

[dosubot[bot]]

The issue you're experiencing with regex expressions being distorted in code blocks might be related to how the Dify WebApp handles the rendering of code blocks. The CodeBlock component is responsible for rendering code blocks in the UI, and it includes a header with the language name and action buttons like a copy button. The code content is rendered within a div element ^[1].

If special characters in regex expressions are being altered, it could be due to how these characters are processed or escaped before rendering. Unfortunately, there isn't specific information available about how Dify handles escaping or encoding of special characters within code blocks, or any known issues related to this ^[1].

To address this, you might want to check if there are any configurations or settings in your environment that could affect the display of special characters. Additionally, reviewing the preprocessThinkTag function, which is responsible for rendering markdown content, might provide insights into how content is processed before rendering ^[2].

To continue talking to Dosu, mention @dosu.

---

^{Help Dosu learn! Give it feedback: Great Response | Irrelevant Answer | Incorrect Sources | Too Verbose | Hallucination | Bug Report | Other}