Quick Bites 7 - Dr. TamperMonkey (Or: How I Learned to Stop Worrying and Love JavaScript)

We get really excited here at Secure Ideas about sharing knowledge with others.  Our mission statement is “Provide the best penetration testing experience possible.”  One of the ways we accomplish this is by sharing as much information with our clients about the pentesting process as possible.  Walking through attack vectors and mitigation techniques with our clients is a lot of fun, because we get to teach.  We love to teach and train people to do what we do, which brings me to the topic of today’s blog: tips on how to start writing your own browser userscripts for use with TamperMonkey or Greasemonkey. 

Recently, I found myself in need of a tool to fill out a lot of form inputs in a web application for an API pentest.  I’m talking about a lot of inputs, in several pages.  Most of the inputs needed to be filled with testing payloads, generally payloads containing data like “testing1” or “fuzzme17”.  Some of the inputs needed to be specific to the datatype the form was expecting, like dates.  A couple of the inputs were very specific to the API I was testing (think API keys). Being that there were a lot of forms with several inputs per form, I DID NOT want to do this manually. There had to be a better way. 

I ended up first looking for a Chrome extension that would do it, but didn’t find any that I liked. There were a few that were made to automatically fill out form inputs, but they didn’t really suit my needs.  I asked around, and someone had mentioned userscripts.  I had heard of userscripts, but had not actually used nor written any before.  Honestly, I needed something to write a blog post about, so I decided that I should write my own tool to do exactly what I needed - autofill in a bunch of different forms with various fuzzing payloads.

Many of you may be familiar with userscripts, but for those who are not, I’ll elaborate here.  I’ve found several different definitions of userscripts online, but I’ll distill them to this:  A userscript is code (most often JavaScript) written by the user of a web application to enhance or alter the application to suit the user’s needs.  Since almost all web applications today use JavaScript in some form, it’s not hard to whip up a little code to make an application do what you want it to.  Userscripts are generally used in conjunction with a browser extension like GreaseMonkey or Tampermonkey, but the browser’s console can be used quickly and easily to do the alterations.  So grab the GreaseMonkey or TamperMonkey extensions, and find some user scripts that already exist for examples. It’s amazing what can be done with these extensions! I personally prefer TamperMonkey.

Now, for most hackers, coding comes easy.  For me, not so much.  Anyone that knows me can tell you (because I talk about it ALL THE TIME) that I come from the system administrator side of IT, not the dev side.  For those of you who may not get what I’m trying to say, I work with a TON of former developers here, and they’re all world class hackers.  I’m a good network hacker because of my former life as a network/sysadmin and helpdesk guru, but when it comes to writing my own tools, or trying to write anything that is more than a few lines of code…well, it takes me about 5x longer than anyone else.  I can get there, but I’m just simply not used to writing code all the time. 

As I previously said, I work with a bunch of world class hackers and devs, so almost any questions that I have are answered within minutes or even seconds of asking it.  Seriously, the Secure Ideas crew are top notch, phenomenal people to work with.  So, when I started out the journey to writing my own userscript for this purpose, I googled what I could, and then asked questions. I learned a lot while working through this process, which is why I’m writing this blog post - I want to share some of this information with you, Dear Reader. 

So, here are some tips that helped me out when I was working through the userscript I wrote.  (And honestly, I’m hoping that it helps me to remember this later when I need to write another one. :D) 

1. Have a clear plan of what the end goal is - Having a clear idea of what you want out of your userscript (and really, any tool that you write), will help you with writing it.  When I first started writing the script, all I knew was that I needed it to fill out forms. The end.  Eventually, I realized that there were some other things that I wanted/needed it to do that I hadn’t thought about at first. That’s ok, sometimes you just have to roll with it. It’s virtually impossible to think through all the scenarios you might have, but having a good game plan will help with the writing process. 

1. Use the browser console first - This is specific to webapp script writing, particularly with JavaScript (it can also apply to JS frameworks, such as jQuery, React, etc).  When working with JavaScript, it’s super helpful to see how it interacts with the web page.  Making tweaks to the code while watching it work is one of the best ways to write and debug the code. 

1. Learn how the Document Object Model (DOM) works - The DOM is the basis of how web pages are rendered in the browser.  It is the owner of all the different elements of how the page is structured.  The DOM tells you how to access and/or change the different elements and attributes.  Really, it's the core of how the web page works.  There are several different JavaScript libraries and frameworks that can help simplify working with the DOM, but having a deeper understanding of the core will help with understanding and writing for all the rest of the frameworks.  

1. Use a good IDE or source code editor - Integrated Development Environments (IDE) and source code editors have been around for many years.  When I started writing code some 20 years ago, I was just using Notepad. And I stuck with that for, well, until I discovered Notepad++ about 10 years ago.  I’ve not had a lot of formal training as a developer, so IDEs and editors scared me, primarily because I wasn’t sure how to use them, and there’s a lot to them.  Then, Visual Studio Code, aka VS Code, came along.  VS Code is a super simple solution to code editing, complete with syntax highlighting, debugging, git functionality, and several other functions built in.  It also has an extensive plugin base to add to it.  If you’re not familiar with it for writing code, it’s worth checking out. 

1. Don’t be afraid to make mistakes - Mistakes are how we learn. I often learn more from my mistakes than when I do something right the first time.  Writing this code, and finding out why something didn’t work often taught me more than I could have guessed about how the DOM, JavaScript, and the browser all work together to render pages.  Not to mention how I can change them.  

While I spent many frustrating hours trying to figure out how to write this specific tool for auto filling web forms, I’m happy with how it came out.  With that being said, there’s still a lot of work to be done with it, as I want to make it a little more page agnostic, so that it can be used across the board with minimal code editing.  Maybe when I get that done, I’ll post more info about what the process was, and how I got the end product.  

Now that you have a little bit of a framework for writing scripts, Go Hack Something Today!  (Thanks Ogs!)

Aaron