Another greasemonkey login script

Question

For my first go at writing a greasemonkey script I decided to try creating an autologin script.

The page I am trying to login to is built as;

<input class="form-control" type="text" data-reactid=".0.0.1:$0.1.1:$input" placeholder="Username"></input>
</div>
<div class="form-group" data-reactid=".0.0.1:$0.2">
<input class="form-control" type="password" data-reactid=".0.0.1:$0.2.1:$input" placeholder="Password"></input>
</div>
<button class="btn-block btn btn-lg" data-reactid=".0.0.1:$0.3" type="button" disabled="">

The button becomes enabled when you populate the username/password values. So far my script looks like:

var name = "foo";
var pass = "bar";
document.getElementByTagName ([placeholder="Username"]).value = name;
document.getElementByTagName ([placeholder="Password"]).value = pass;
var evt = document.createEvent ("HTMLEvents");
evt.initEvent ("click", true, true);
document.getElementByClassName('btn-block btn btn-lg btn-primary').dispatchEvent (evt);

...but this doesn't seem to actually push data into the username/password fields. I added some alert statements to basically step through and it looks like it dies when I first use document.getElementByTagName

Did you possibly mean `getElement*s*ByTagName` and `getElement*s*ByClassName`? — Dan Oberlam, Jul 15 '15 at 22:08

score 0 · Answer 1 · edited May 23 '17 at 11:51

You probably wanted to use getElementsByTagName and getElementsByClassName - note that "Elements" is plural in those function names.

That being said, I don't believe an attribute selector works with getElementsByTagName. You could write your own function that achieves a similar goal (like in this answer) but you're probably better off using document.querySelector.

var name = "foo";
var pass = "bar";
document.querySelector('[placeholder="Username"]').value = name;
document.querySelector('[placeholder="Password"]').value = pass;
var evt = document.createEvent("HTMLEvents");
evt.initEvent("click", true, true);
document.querySelector('.btn-block, .btn, .btn-lg, .btn-primary').dispatchEvent(evt);

Note that document.querySelector returns the first result that matches the query - make sure that there is only one thing that matches it.

Another greasemonkey login script

1 Answers1