wait for angular app to be fully rendered from phantom script

Question

I\'m writing a script which generates png images from every page of my frontend. I\'m using angular for the UI and capturing the pages with phantom.

The view take a whil

Answer 1

The associated PhantomJS API is onCallback; you can find the API doc on the wiki.

// in angular
$scope.$on('$viewContentLoaded', function () {
  window.callPhantom();
});

// in the phantomjs script
var page = require('webpage').create();
page.onCallback = function() {
  page.render('snapshot.png');
  phantom.exit();
};
page.open('http://localhost:9000/');

You can get access to the $rootScope by accessing the injector; for example, if you're using the ng-app directive, you can find the element with the directive and call .injector().get("$rootScope") on it. However, I'm not sure if the $viewContentLoaded event will already have fired by then.