I’m working on a Chrome extension and having issues with setting the value of the chat input <textarea> programatically. With the below approach, I can briefly see a value change, but then it disappears (likely a controlled component). I’ve tried sending some KeyboardEvent after changing the value, but haven’t had any luck. Any ideas on how I could best set this value?
Solution:
The chatInput is what is known as a “controlled component” in the world of UI libraries like React (which Twitch uses) or Vue. The application manages the value of the <textarea> interally, controlling what happens to incoming input through event listeners. So to change the value, you want to do so through mimicking the event.
A naive solution that I was able to start moving ahead with in this case after setting the value is: