Unlike a traditional browser, which is constantly running JavaScript, our renderer has to detect when a document is "finished" loading JavaScript. This is sometimes very difficult (AJAX requests, dynamic script tags, chart animations, etc). To avoid being stuck in loops or delays, the PDF renderer takes a conservative approach and attempts to make your PDF as soon as possible.

On rare occasions, this approach is too conservative and we make the PDF before your JavaScript is finished loading. If this happens to your document, you can easily override our JavaScript-finished detection by adding a JavaScript function to your page called docraptorJavaScriptFinished().  This function should return true if your page has finished rendering, or false otherwise. Any other return value is considered an error. 

Here's an example of simply delaying 10 seconds to give your JavaScript more time to finish:

var didWait = false;
// DocRaptor polls docraptorJavaScriptFinished until it is true
docraptorJavaScriptFinished = function() {
  if (! didWait) {
    setTimeout(function(){
      didWait = true;
    }, 10000);
    return false;
  }
  // It's been 10 seconds, let's return true and make the PDF!
  return true;
}

For a faster and more accurate Javascript-finished detection, you might set didWait to true in your actual rendering function. Or you could check to see if your dynamically-loaded chart is on the page yet, like this:

docraptorJavaScriptFinished = function() {
  return document.getElementById("anAsyncChart") != null;
}

Because the function is called in the context of your page, you can use all of your usual tools, like jQuery or Underscore, to determine if DocRaptor should move on to PDF rendering.

Did this answer your question?