Main things we want to do when automating webpages

• Find stuff
• Type stuff
• Click stuff

Find stuff

Finding stuff can be done with querySelector and querySelectorAll. I like to alias them to $ and $$ respectively (poor man's jquery!) you could also use umbrellajs or something.

Type stuff

To type something into the currently focused element use execCommand (it's deprecated but whatever)

document.execCommand("insertText", false, "some text");

execCommand has the advantage that it isn't detectable by the site you're automating stuff for. That means no weird conflicts with web frameworks!

Alternatively you can construct input events and modify the value of an element, but this usually ends up being brittle.

Click stuff

To click an element just use .click(), you can also create and dispatch the MouseEvent manually for more control. Websites can detect if a click was automated though, and some stop it.