CasperJS form AJAX results do not appear

Question

I am trying to scrape some website results after a form submit.

Using Chrome Developer Tools console, I am able to fill out the form and submit. On the Network tab, there are two POSTs, and then results appear on the page.

I’m trying to mimic this process unsuccessfully with CasperJS.

var casper = require('casper').create({
clientScripts: ["./jquery.min.js"],
verbose: true,
logLevel: 'debug',
pageSettings: {
    loadImages: false,
    loadPlugins: false,
    userAgent: 'Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.2 Safari/537.36',
    webSecurityEnabled: false,
}
});

casper.start('https://ptabtrials.uspto.gov', function() {});

casper.thenOpen('https://ptabtrials.uspto.gov/prweb/PRWebLDAP2?UserIdentifier=searchuser', function() {
        this.evaluate(function(search){
            return jQuery('input#SearchTrialNumber').attr({'value': search});
        }, 'ipr');

        this.evaluate(function(){
            return jQuery('div.pzbtn-mid:contains("Search")').click();  
        });
});

This next part is where it breaks. It seems like the page never refreshes with new content, and the process hangs on casper.waitUntilVisible:

casper.waitUntilVisible("#PEGA_GRID_CONTENT", function(){
        var results = this.evaluate(function(){
            return jQuery("#PEGA_GRID_CONTENT tr.cellCont").size();
        });
        console.log(JSON.stringify(results));
});

The terminal responds with [warning] [phantom] Casper.waitFor() timeout. Using waitFor() seems correct because the form is refreshed with AJAX.

I modified jQuery to avoid $ namespace conflict with the existing code, to use jQuery instead.

Answer 1

There is no click handler on the div.pzbtn-mid:contains("Search"). You should use:

this.evaluate(function(){
    return jQuery('button:contains("Search")').click();  
});

instead of

this.evaluate(function(){
    return jQuery('div.pzbtn-mid:contains("Search")').click();  
});