Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Chatbot component freeze when using specific LaTeX delimiters #8006

Closed
1 task done
GaiZhenbiao opened this issue Apr 11, 2024 · 5 comments · Fixed by #8658
Closed
1 task done

Chatbot component freeze when using specific LaTeX delimiters #8006

GaiZhenbiao opened this issue Apr 11, 2024 · 5 comments · Fixed by #8658
Assignees
Labels
bug Something isn't working Priority High priority issues Regression Bugs did not exist in previous versions of Gradio

Comments

@GaiZhenbiao
Copy link

Describe the bug

The issue I'm encountering is reminiscent of the one documented in #7651. Specifically, when setting certain LaTeX delimiters (such as \[ and \], or $) within the Chatbot component, it ceases to function, accompanied by a JavaScript error identical to the one described in the referenced issue.

I think this malfunction likely stems from a conflict between the JavaScript responsible for markdown rendering and that for LaTeX rendering, as both systems utilize similar notation (e.g., [xxx] in Markdown). Interestingly, using $ as a LaTeX delimiter is expected to be conflict-free, I don't know what could go wrong. Besides, messages incorporating \[ and \] consistently trigger this bug 100% of the time, whereas $ results in the bug approximately 50% of the time.

Have you searched existing issues? 🔎

  • I have searched and found no existing issues

Reproduction

import json
import time

import gradio as gr

with open("chatbots3.json", "r") as f:
    data3 = json.load(f)

with open("chatbots4.json", "r") as f:
    data4 = json.load(f)

def update_chatbot3():
    for d in data3:
        time.sleep(0.005)
        yield d

def update_chatbot4():
    for d in data4:
        time.sleep(0.005)
        yield d

latex_delimiters_set = [
        # {"left": "$$", "right": "$$", "display": True},
        # {"left": "\\(", "right": "\\)", "display": False},
        {"left": "\\[", "right": "\\]", "display": True},
        {"left": "$", "right": "$", "display": False},
    ]

with gr.Blocks() as demo:
    chatbot = gr.Chatbot(
        latex_delimiters=latex_delimiters_set,
    )

    trigger_btn3 = gr.Button("Trigger Chatbot Bug [] (100% triggers bug)")
    trigger_btn4 = gr.Button("Trigger Chatbot Bug $$ (~50% triggers bug)")
    trigger_btn3.click(update_chatbot3, [], chatbot)
    trigger_btn4.click(update_chatbot4, [], chatbot)

demo.queue().launch()

chatbots3.json
chatbots4.json

Screenshot

image

Logs

There is no log printed in Python console, even when debug=True is set.

=========
Chromium JS console log:
Uncaught (in promise) DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.
    at insert (http://127.0.0.1:7860/assets/svelte/svelte.js:659:9)
    at HtmlTag.i (http://127.0.0.1:7860/assets/svelte/svelte.js:1534:4)
    at HtmlTag.p (http://127.0.0.1:7860/assets/svelte/svelte.js:1545:8)
    at Object.p (http://127.0.0.1:7860/assets/Example.svelte_svelte_type_style_lang-f389d183.js:332:515)
    at Object.p (http://127.0.0.1:7860/assets/Example.svelte_svelte_type_style_lang-f389d183.js:332:791)
    at update (http://127.0.0.1:7860/assets/svelte/svelte.js:2128:30)
    at flush (http://127.0.0.1:7860/assets/svelte/svelte.js:2088:5)

System Info

Gradio Environment Information:
------------------------------
Operating System: Darwin
gradio version: 4.26.0
gradio_client version: 0.15.1

------------------------------------------------
gradio dependencies in your environment:

aiofiles: 23.2.1
altair: 5.1.2
fastapi: 0.104.1
ffmpy: 0.3.1
gradio-client==0.15.1 is not installed.
httpx: 0.25.2
huggingface-hub: 0.21.3
importlib-resources: 6.1.1
jinja2: 3.1.2
markupsafe: 2.1.3
matplotlib: 3.8.1
numpy: 1.26.4
orjson: 3.10.0
packaging: 23.2
pandas: 2.2.1
pillow: 10.2.0
pydantic: 2.5.2
pydub: 0.25.1
python-multipart: 0.0.9
pyyaml: 6.0.1
ruff: 0.3.0
semantic-version: 2.10.0
tomlkit==0.12.0 is not installed.
typer: 0.9.0
typing-extensions: 4.9.0
uvicorn: 0.24.0.post1
authlib; extra == 'oauth' is not installed.
itsdangerous; extra == 'oauth' is not installed.


gradio_client dependencies in your environment:

fsspec: 2023.10.0
httpx: 0.25.2
huggingface-hub: 0.21.3
packaging: 23.2
typing-extensions: 4.9.0
websockets: 11.0.3

Severity

I can work around it

@GaiZhenbiao GaiZhenbiao added the bug Something isn't working label Apr 11, 2024
@Keldos-Li
Copy link
Contributor

Keldos-Li commented Apr 11, 2024

BTW, gradio webUI would also break down if set latex_delimiters_set like this

latex_delimiters_set = [
        {"left": "\\begin{equation}", "right": "\\end{equation}", "display": True},
        {"left": "\\begin{align}", "right": "\\end{align}", "display": True},
        {"left": "\\begin{alignat}", "right": "\\end{alignat}", "display": True},
        {"left": "\\begin{gather}", "right": "\\end{gather}", "display": True},
        {"left": "\\begin{CD}", "right": "\\end{CD}", "display": True},
 ]

when bot returns something like

\begin{equation}
E = mc^2
\end{equation}

We have noticed that after adapting to gradio4. Gradio3 is fine with mathjax and mark.js

@abidlabs abidlabs added the Regression Bugs did not exist in previous versions of Gradio label Apr 11, 2024
@abidlabs
Copy link
Member

thanks for reporting, cc @dawoodkhan82

@Keldos-Li
Copy link
Contributor

Any updates on this?🥺

@GaiZhenbiao
Copy link
Author

Any updates on this?🥺

@dawoodkhan82 dawoodkhan82 self-assigned this Jun 20, 2024
@dawoodkhan82
Copy link
Collaborator

Will take a look soon!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working Priority High priority issues Regression Bugs did not exist in previous versions of Gradio
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants