Click a button to download a file using CasperJS

Question

I want to write unit tests to download a file by clicking a form button using casperJS. I tried using document.getElementsByTagName to get to the button and clicked it in JavaScript's way. But I got an error message:

TypeError: 'undefined' is not a function (evaluating 'inputs[1].click()')

The segment of the code that didn't pass the test :

casper.then(function() {
    var inputs = document.getElementsByTagName('input');
    inputs[1].click();
});

When I tried executing the same code from the console in my browser, the button got clicked and the download window popped up.

I initially tried to check with the presence of the button with assertExists function in casperJS. The assertion passed, indicating that the button exists. Also, inputs array has 2 elements, one is hidden input of CSRF token (I'm using Django) and the other is the button that I want to click.

Answer 1

Clicking

PhantomJS (and by extension CasperJS) has two contexts. Only the page context (evaluate()) can access the DOM. The other problem is that most elements don't implement the element.click() function in PhantomJS, so you would need to use another type of click.

CasperJS provides a casper.click() function which works in almost all cases. It can select the element that you want to click either by CSS selectors or XPath expressions. Since you want to click the second input, it is not possible to define a general CSS selector that does this. An XPath expression must be used in this case. CasperJS provides an XPath utility:

var x = require('casper').selectXPath;
...
casper.then(function(){
    this.click(x("(//input)[2]"));
});

Please note that counting starts with 1 in XPath expressions and CSS selectors.

---

Downloading

PhantomJS (and by extension CasperJS) won't trigger a file download when you click on something. You will need to build and send the request yourself.

There are many ways of doing it. Here is one example. Actually, a better way would be to use a PhantomJS fork that natively supports file downloading as part of a new event. See this answer for more details.