How to trigger oninput event after insert string to textbox with JS?

Question

I want insert a string into textbox by below JavaScript code:

document.querySelector('textarea').value = '0a06282c0241057a10011805220d080510bea3f493062a03010c1628f1a6f493063002382b4001481482010f383634333233303532343736343839';

1- The first mode: After execute the above code, When I just click on submit button result not work because oninput event not enable.

Result 1 is empty and not work :

---

2- The second mode: After execute the above code, When I enter one (or more) space to textbox then click on submit button, result work perfectly because oninput event activated.

---

How can I active oninput event with JS?

Note 1: I'm not owner the website and I have not back end code for change or find oninput event function for call the function directly .

Note 2: I run the JS code in browser console.

Answer 1

There are a couple of approaches to consider. The "hard way" would be to construct an InputEvent and submit it to the message pump.

const event = new InputEvent(...);
textarea.dispatchEvent(event);

But I think an easier way would be to save a reference to the function you register to the event listener, and just call that directly:

var inputHanlder = function(...) {};
addEventListener("input", e => { inputHandler(/*event properties*/) });
...
// some kind of sequence of events that loads the text area
inputHandler(...);

You might choose the hard way if you have limited access to the event registration or the input handler function.