This falls between Information Security and JavaScript coding:

The developers of a certain website disabled the option to save form data. Not even usernames can be saved so I tried to overcome this with a Greasemonkey script, via:

document.querySelector('#username').value = "myUsername";

I can fill all non-password fields this way but this won't be enough:

After I filled all non-password fields with a similar document.querySelector operation, and after I manually inserted my password I clicked "Submit" but I'm being told that "all fields are necessary"; seems like the value assignments aren't "recognized" by the site.

Problem 1:

The content does become recognized if, for example, I delete the last letter of the assigned value, that is, if I navigate with the mouse to a certain field (the username field in that case), delete the last letter from myUsername so it becomes myUsernam and then if I bring back the e` and repeated this action, then submit is executed properly.

Problem 2:

Either way, seems I always need to click on each form-field with the mouse (that is, trigger an onclick event per each field); doing so for all fields triggers a modal (a popup) with a small "show us you're not a robot" type of quiz.

document.querySelector('#username').click(); doesn't seem to trigger a proper response (I get "undefined" in console); Nothing is happening compared to an actual mouse click on the field.

I tried to dispatch a change() event per each field but it doesn't change the situation.

My question

How to overcome the 2 problems of unrecognized values and the need to click oon each field and how could I overcome it with vanilla JavaScript?

  • 1
    If you want to circumvent the form automatically, I think you can use GreaseMonkey to generate a POST request that contains the form data directly, so you won't even have to click "submit". Fill the form, open your console, check "Keep logs", send the form normally, and see what request appears in "network" tab. Mimic that request in an AJAX call.
    – Xenos
    Jun 18, 2018 at 11:32

1 Answer 1


I tried to dispatch a change() event per each field but it doesn't change the situation.

I think the problem is indeed that the JavaScript on the page expects some event. If you enter text normally you would trigger keydown, input and other events. Any of these events may copy the value of the textfield to some JavaScript variable. If you change the value of the textfield but don't trigger the event, the JavaScript won't notice the change.

Inspect the input field with the debugger tools in the browser, and list the attached events. That will give you a clue to which event to use. Then, trigger that event like this:

element.dispatchEvent(new Event("input"));
  • There might also be a custom function that does the field-filling check: one could override this function with a mook returning always true form.checkFunctionIfItsTheRealFieldName = function () { return true; }
    – Xenos
    Jun 18, 2018 at 11:34

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .