Make PhantomJs wait for an Ajax Request before generating a pdf

Question

Using the example from phantomjs works like a charm

https://github.com/ariya/phantomjs/blob/master/examples/rasterize.js?utm_content=bufferda3e0&utm_source=buffer&utm_medium=twitter&utm_campaign=Buffer

However what happens if the url needs to make an Ajax request in order to load it's data? Can I fire a custom event so the pdf is only generated then ?

(I don't want to guess how much time the request will take and set a timeout)

Answer 1

The common solution to this problem is to wait for an element that will appear on the page after AJAX request has finished.

Include the waitFor function from this example and wait for the first function passed as argument to waitFor to return true, then it will run the function passed as the second argument.

page.open("https://example.com/ajaxified/", function (status) {
    waitFor(function() {
        return page.evaluate(function() {
            return document.querySelectorAll(".report").length > 0;
        });
    }, function() {
       page.render("report.pdf");
       phantom.exit();
    });

});