node package manager
Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


node-webpap Dependency Status Build Status Coverage Status

Take multiple pictures of a web page via the well known "say cheese", "cheeeese" retoric. i.e. ask to take a picture, webpage signals when it's ready, picture is taken.

It's an optimisation thing - webpap allows you to take many photos of a web page without having to spawn a new phantomjs instance and wait for your page to download it's resources and be ready before every photo you take.

How to

Your webpage needs to listen for a HTML5 message whose payload is an object with a sender property that has the value webpap.phantom. Other object properties will be as per the options you passed to take.

When your page is ready to have its picture taken it should call window.callPhantom().



var webpap = require("webpap")
  , fs = require("fs")
// Create a photo shoot 
webpap.createShoot("http://localhost/index.html", {/* shoot options */}, function(err, shoot) {
  // Take a picture 
  shoot.take({/* photo options */}, function(err, tmpImgPath) {
    // Move the image from the tmp path to where you want it 
    fs.rename(tmpImgPath, "/path/to/img.png", function() {
    // ALWAYS call halt when done with the shoot 
  // ...successive calls to Shoot#take 


window.addEventListener('message', function(event) {
  if( && && == 'webpap.phantom') {
    // Prepare for the photo to be taken 
    // NOTE: is the photo options you passed to Shoot#take 
    // Time passes... 
    // When ready: 
}, false);

Take single

webpap provides a convenience function to allow you to create a shoot, take single a photo and halt the shoot automatically:

var webpap = require("webpap")
  , fs = require("fs")
webpap("http://localhost/index.html", {/* shoot options */}, {/* photo options */}, function(err, tmpImgPath) {
  // Move the image from the tmp path to where you want it 
  fs.rename(tmpImgPath, "/path/to/img.png", function() {

Shoot options

Options passed to webpap#createShoot:


Type: String Default value: Path provided by phantomjs module

Path to phantom binary


Type: Object Default value: {}

Object with key value pairs corresponding to phantomjs command line options


Type: Boolean Default value: false

Automatically inject JavaScript into the page that immediately calls back to phantom when the HTML5 message is received.

Photo options

Options passed to Shoot#take. Note that all these options are postMessage'd to your webpage before the shot is taken so you are free to pass arbirtary data.


Type: Number Default value: 100


Type: Number Default value: 100


Type: Number Default value: 0


Type: Number Default value: 0


Type: Number Default value: 30000

Time in milliseconds before webpap considers the web page to be non responsive and returns with an error.