Modifying HTML with JavaScript - JavaScript for Pentesters task 1 write up

Oct 20, 2014 • jsp, javascript, security-tube, xss

Pentester Academy is one of the great infosec resources for people who wanted to take their skills to the next level. JavaScript for Pentesters is one of the latest courses by pentester academy which has over 21 challenges with varying difficulty. We will be updating the blog with the write-ups of each of them as we crack it.

The objectives of the challenge was:

1) Modify the text “Modify me” to “Modified you” 2) Modify the text “Find me” to “Found you”

The very first thing a pentester should follow is to be systematic while doing a pentesting. Don’t quickly jump of with several payloads before carefully analyzing the conditions. In the challenge, the first thing is to check if it is  vulnerable to XSS. So lets try a basic payload to test it:

<script>alert("XSS")</script>

When you click submit, you can see an alert box which displays the string “XSS” which means we can execute arbitrary JavaScript code on the page. The next thing is to complete the first task, i.e, Modify the text “Modify me” to “Modified you” . So let us see the source code to analyse what kind of text it is or if the text has an associated html id (then things would have been much easier). When you see the source code, you will come across this part:

As you can see, the text “Modify me” is inside an h2 tag. Also you can see that there are 2 blind (without any contents) h2 tags above, which means our h2 tag is in the 3rd position. Now our aim is to modify the HTML inside the 3rd h2 tag. The best way to change the innerHTML of any tags is to use the getElementsByTagName followed by change in the innerHTML:

<script>
document.getElementsByTagName("h2")[2].innerHTML = "Modified you";    
</script>

The getElementsByTagName returns a list of all the objects under a particular tag name. getElementsByTagName("h2") will return a list of all the different elements inside a particular webpage. In this challenge case, we need to modify the 3rd h2 tag which means the 2nd element of the array. So we modified the payload a bit to select the 2nd element: getElementsByTagName("h2")[2]. Now this will select the 3rd h2 tag in order to modify the HTML inside the tag, we use innerHTML.

The 2nd task is to Modify the text “Find me” to “Found you”. If you check the source code again, you can see that there is only one h1 tag in the entire document, which makes our work much easier. In order to modify it, we will add one more line to the above code and the payload will be like this:

<script>
document.getElementsByTagName("h2")[2].innerHTML = "Modified you";
document.getElementsByTagName("h1")[0].innerHTML = "Found you";
</script>

Since there is only one h1 tag, we use [0] to select the first one. Using this payload, you can successfully complete the challenge.

Note:

1) While playing with XSS challenges, it is always recommended to use Mozilla Firefox because Google chrome has inbuilt XSS stopper which will stop us from executing arbitrary JavaScript code even if the page is vulnerable to XSS. So its strongly recommended to use Firefox instead of chrome.

2) The solutions written above is the way we cracked the problem which might be different from the solution videos provided by the SecurityTube. If you need the solution video, you have to subscribe to PentesterAcademy.

We hope that you really liked this challenge. If there is anything you didn’t understand or wanted to get more clarity, please comment down and we are more than happy to help. Happy pentesting..

Anirudh Anand

Head of Product Security & DevSecOps at @CRED_club | Application Security ♥ | CTF lover - @teambi0s | Security Trainer - @7asecurity | certs - eWDP, OSCP, OSWE