Issue
I am trying to play with some data insertion on forms of this website. I can manually put my cursor on inputs and type digits, such as 999
. If I reload the page, the value that I typed is still there.
I can access this value by using Google Chrome console (on dev tools) and using the element ID OSICtrlE1-23
:
> document.querySelector("#OSICtrlE1-23").value
'999'
Ok. Apparently, until some point, I can also mutate this value using JS and the console:
> document.querySelector("#OSICtrlE1-23").value = 888
It seems to work on the UI. I can see the new value on the UI.
Also, it seems to work on the console when I request the value on the console with JS:
document.querySelector("#OSICtrlE1-23").value
'888'
Unfortunately, if I refresh the page, the value on the UI goes back to 999
(which was the previous value manually inserted).
1 - Why is this happening?
2 - Could the website be restricting what I can do with the console? If so, how to know?
3 - Which command on the console should I be using in order to have the data inserted by computation behaving exactly as the data manually inserted?
Solution
@Yulian was correct. After carefully inspecting how events were being handled, a reverse engineering endeavor found out that blur
was the key.
Hence, dispatching the event did the trick!
See the code that works as expected:
const updateInput = (value) => {
const input = document.querySelector("#OSICtrlE1-23");
input.value = value;
input.dispatchEvent(new Event('blur'));
}
Answered By - Pedro Delfino Answer Checked By - Cary Denson (PHPFixing Admin)
0 Comments:
Post a Comment
Note: Only a member of this blog may post a comment.