Generating clipped screenshots from PhantomJS

This recipe introduces the clipRect property on webpage instances, and it describes its role in rendering portions of our web page content. The recipe also illustrates how to set the property dynamically (for example, to capture specific page elements).

Getting ready

To run this recipe, we will need a script that accesses a web page. We need some knowledge of the structure of the target web page so that we can define a selector to use for further targeting specific content on that web page. We also need write permissions to the filesystem in that script's working directory.

The script in this recipe is available in the downloadable code repository as recipe04.js under chapter07. If we run the provided example script, we must change to the root directory for the book's sample code.

Lastly, the script in this recipe runs against the demo site that is included with the cookbook's sample code repository. To run the demo site, we must have Node.js installed...