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

gr.Textbox display text and sent text mismatch #4762

Closed
1 task done
taoari opened this issue Jul 3, 2023 · 2 comments
Closed
1 task done

gr.Textbox display text and sent text mismatch #4762

taoari opened this issue Jul 3, 2023 · 2 comments
Labels
bug Something isn't working

Comments

@taoari
Copy link

taoari commented Jul 3, 2023

Describe the bug

gr.Textbox() display text and sent text mismatch. The display text is controlled by textarea.value, but the sent text is NOT.

Actually, I am trying to make the chatbot message support buttons. I made it to work by clicking on a button and the text box is updated with the button text. But after hitting ENTER, it still sends an empty string.

Obviously, it is texarea.value controls the display text of Textbox, Any one knows which attribute of textarea is actually sent to the chatbot?

image

Have you searched existing issues? 🔎

  • I have searched and found no existing issues

Reproduction

The following is a simple app that sends messages to a chatbot and the chatbot responds with "I love you".

import gradio as gr

def bot(history, msg):
    return history + [[msg, 'I love you']], ""

with gr.Blocks() as demo:
    chatbot = gr.Chatbot()
    msg = gr.Textbox(show_label=False,
        placeholder="Enter text and press ENTER", container=False, elem_id="inputTextBox")
    msg.submit(bot, [chatbot, msg], [chatbot, msg])
    
demo.launch()

If you type in "foo" in the Textbox, open the browser console and run the following Javascript:

textarea = document.getElementById("inputTextBox").getElementsByTagName("textarea")[0]
textarea.value = "bar"

The Textbox now will display "bar". But if you hit ENTER, it is still "foo" that sends to the chatbot.

Screenshot

Type "foo" in Textbox, and run JS in the console change it to "bar":

image

Go back to Textbox and hit Enter:

image

It is "foo" instead of "bar" sent to the chatbot.

Logs

No response

System Info

gradio version: 3.35.2
os: windows 11

Severity

Blocking usage of gradio

@taoari taoari added the bug Something isn't working label Jul 3, 2023
@abidlabs
Copy link
Member

abidlabs commented Jul 3, 2023

Thanks @taoari by the way, for general questions like this (that are not feature requests or bug reports), please ask in our Forums or our Discord. (I'll close this issue)

@abidlabs abidlabs closed this as completed Jul 3, 2023
@1713172499
Copy link

1713172499 commented Dec 8, 2023

You can try this. It works for me.Run it after the assignment

textarea = document.getElementById("inputTextBox").getElementsByTagName("textarea")[0]

textarea.value = "bar"

// trigger input event.

var keyEvent = new Event('input',{ bubbles: true, cancelable: true });

document.getElementById("inputTextBox").getElementsByTagName("textarea")[0].dispatchEvent(keyEvent);

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants