Home > front end >  How to properly set value of editable div?
How to properly set value of editable div?

Time:08-01

For input and other elements with value I could use Object.getOwnPropertyDescriptor(input, 'value').set; and then element.dispatchEvent(new Event('input', {bubbles: true})), but this doesn't work for contentEditable div. There is no value to set and no set() function in it.

I'm trying to simulate sending message in Twitch chat, I need it for my chrome extension. I know it's stupid to do it via UI, but this is only way I know. If you can manually type in chat, then there gotta be some way to do it programmatically, right? If you go to twitch and try method above on search field, it will work, because it's normal input. How to do same thing on chat?

CodePudding user response:

The input field for the Twitch chat is actually a <textarea> that also has a value attribute that you can set programmatically with:

let textarea = document.querySelector("textarea");
textarea.value = "foobar";

However you might need to tweak this a little when there are more than just one textarea on the page.

CodePudding user response:

you could simply do this in a Stream Chat:

document.querySelector('textarea').innerText = "hello world";
document.querySelectorAll('.Layout-sc-nxg1ff-0.dWdTjI')[5].click();
  • Related