fix: 修复显示raw message中latex也被渲染的问题

ChuanhuChatbot.py

@@ -52,7 +52,7 @@ with gr.Blocks(css=customCSS, theme=small_and_beautiful_theme) as demo:
     with gr.Row(equal_height=True):
         with gr.Column(scale=5):
             with gr.Row():
-                chatbot = gr.Chatbot(label="Chuanhu Chat", elem_id="chuanhu_chatbot", latex_delimiters=latex_delimiters_set, height=700, show_copy_button=True)
+                chatbot = gr.Chatbot(label="Chuanhu Chat", elem_id="chuanhu_chatbot", latex_delimiters=latex_delimiters_set, height=700)
             with gr.Row():
                 with gr.Column(min_width=225, scale=12):
                     user_input = gr.Textbox(

assets/custom.js

@@ -407,7 +407,7 @@ function setSliderRange() {
 function addChuanhuButton(botElement) {
     var rawMessage = botElement.querySelector('.raw-message');
     var mdMessage = botElement.querySelector('.md-message');
-    var gradioCopyMsgBtn = botElement.querySelector('div.icon-button>button[title="copy"]'); // 获取 gradio 的 copy button，它可以读取真正的原始 message
+    // var gradioCopyMsgBtn = botElement.querySelector('div.icon-button>button[title="copy"]'); // 获取 gradio 的 copy button，它可以读取真正的原始 message
     if (!rawMessage) {
         var buttons = botElement.querySelectorAll('button.chuanhu-btn');
         for (var i = 0; i < buttons.length; i++) {
@@ -433,20 +433,7 @@ function addChuanhuButton(botElement) {
         const textToCopy = rawMessage.innerText;
         try {
             if ("clipboard" in navigator) {
-                gradioCopyMsgBtn.click();
-                try {
-                    // try to copy from gradio's clipboard, which is really raw message
-                    const gradio_clipboard_content = await navigator.clipboard.readText();
-                    const regex = /<!-- SOO IN MESSAGE --><div class="really-raw hideM">([\s\S]*?)\n<\/div><!-- EOO IN MESSAGE -->/;
-                    const real_raw_message = gradio_clipboard_content.match(regex)[1];
-                    const after_agent_prefix = str.replace(/<!-- S O PREFIX --><p class="agent-prefix">(.+?)<\/p><!-- E O PREFIX -->/g, '$1\n');
-                    await navigator.clipboard.writeText(after_agent_prefix)
-                    // console.log("Copied from gradio's clipboard");
-                } catch (error) {
-                    await navigator.clipboard.writeText(textToCopy);
-                    // console.log("Copied from rawtext clipboard");
-                }
-                // await navigator.clipboard.writeText(textToCopy);
+                await navigator.clipboard.writeText(textToCopy);
                 copyButton.innerHTML = copiedIcon;
                 setTimeout(() => {
                     copyButton.innerHTML = copyIcon;
@@ -501,7 +488,11 @@ function renderMarkdownText(message) {
 }
 function removeMarkdownText(message) {
     var rawDiv = message.querySelector('.raw-message');
-    if (rawDiv) rawDiv.classList.remove('hideM');
+    if (rawDiv) {
+        rawPre = rawDiv.querySelector('pre');
+        if (rawPre) rawDiv.innerHTML = rawPre.innerHTML;
+        rawDiv.classList.remove('hideM');
+    }
     var mdDiv = message.querySelector('.md-message');
     if (mdDiv) mdDiv.classList.add('hideM');
 }

modules/utils.py

@@ -235,8 +235,8 @@ def convert_bot_before_marked(chat_message):
     if '<div class="md-message">' in chat_message:
         return chat_message
     else:
-        raw = f'<div class="raw-message hideM">{clip_rawtext(chat_message)}</div>'
-        really_raw = f'{START_OF_OUTPUT_MARK}<div class="really-raw hideM">{clip_rawtext(chat_message, need_escape=False)}\n</div>{END_OF_OUTPUT_MARK}'
+        raw = f'<div class="raw-message hideM"><pre>{clip_rawtext(chat_message)}</pre></div>'
+        # really_raw = f'{START_OF_OUTPUT_MARK}<div class="really-raw hideM">{clip_rawtext(chat_message, need_escape=False)}\n</div>{END_OF_OUTPUT_MARK}'
 
         code_block_pattern = re.compile(r"```(.*?)(?:```|$)", re.DOTALL)
         code_blocks = code_block_pattern.findall(chat_message)
@@ -250,7 +250,7 @@ def convert_bot_before_marked(chat_message):
                 result.append(code)
         result = "".join(result)
         md = f'<div class="md-message">{result}\n</div>'
-        return raw + md + really_raw
+        return raw + md
 
 def convert_user_before_marked(chat_message):
     if '<div class="user-message">' in chat_message:
@@ -283,6 +283,7 @@ def escape_markdown(text):
         '|': '&#124;',
         '$': '&#36;',
         ':': '&#58;',
+        '\n': '<br>',
     }
     text = text.replace('    ', '&nbsp;&nbsp;&nbsp;&nbsp;')
     return ''.join(escape_chars.get(c, c) for c in text)