How to change the value of an input field

Viewed 64

I'm just an amature hobbist trying to automate surfing the web. I'm trying to do get the browser to fill in the username and password then click the sign in button for me using Javascript and Tampermoneky. On some website I just need document.getElementById("username").value="myusername"; document.getElementById("siginButton").click() and I'm in. However on https://login.payoneer.com/, when I use the script in Tampermonkey it doesn't change the input field value at all. When I type the code in the console, the value displayed changes but when I click on it it disappears. Can someone suggest a way to change those value or at least a way to write a script to log me in automatically, changing the input value or not Here is what the empty input field looks like in HTML

    <input id="username" class="text-box__input" type="text" name="username" autocomplete="off" value="">

And when it's filled by typing

   <input id="username" class="text-box__input text-box__input--filled text-box__input--fixed-label" type="text" name="username" autocomplete="off" value="typedin">
1 Answers

I've tried to swap the input but no success. The value does stay in the input but it does not pass the validation. I think this is due to them using React (a Javascript framework) it probably takes over the vanilla form validation.

const input = document.getElementById('username');
const newInput = document.createElement('input');
newInput.id = 'username';
newInput.classList.add('text-box__input', 'text-box__input--filled');
newInput.name = 'username';
newInput.value = 'My new value';

currentInput.parentNode.replaceChild(newInput, input);

I did come up with something else though, maybe you can target or focus on the input and then dispatch keyboard events to literally write the whole value as if were typed by a human. ( I did not test this )

input.dispatchEvent(new KeyboardEvent('keydown', {'key': 'a'}));
Related