PhantomJS: Capturing single dom elements as png files

gistfile1.js

var page = new WebPage(),
    address, output, size;
    
//capture and captureSelector functions adapted from CasperJS - https://github.com/n1k0/casperjs
capture = function(targetFile, clipRect) {
    var previousClipRect;
    var clipRect = {top: 0, left:0, width: 40, height: 40};
    if (clipRect) {
        if (!isType(clipRect, "object")) {
            throw new Error("clipRect must be an Object instance.");
        }
       // previousClipRect = page.clipRect;
        //page.clipRect = clipRect;
        console.log('Capturing page to ' + targetFile + ' with clipRect' + JSON.stringify(clipRect), "debug");
    } else {
        console.log('Capturing page to ' + targetFile, "debug");
    }
    try {
        page.render(targetFile);
    } catch (e) {
        console.log('Failed to capture screenshot as ' + targetFile + ': ' + e, "error");
    }
    if (previousClipRect) {
        page.clipRect = previousClipRect;
    }
    return this;
}

captureSelector = function(targetFile, selector) {
    var selector = selector;
    return capture(targetFile, page.evaluate(function(selector) {  
        try { 
            var clipRect = document.querySelector(selector).getBoundingClientRect();
            return {
                top: clipRect.top,
                left: clipRect.left,
                width: clipRect.width,
                height: clipRect.height
            };
        } catch (e) {
            console.log("Unable to fetch bounds for element " + selector, "warning");
        }
    }, { selector: selector }));
}

if (phantom.args.length != 1) {
    console.log('Usage: makebuttons.js buttons.html');
    phantom.exit();
} else {
    address = phantom.args[0];
    page.viewportSize = { width: 200, height: 200 };
    page.paperSize = { width: 1024, height: 768, border: '0px' }
    page.open(address, function (status) {
        if (status !== 'success') {
            console.log('Unable to load the address!');
        } else 
        {
           //dump out each icon in buttons.html as individual png file
            var iconRules = ['.ui-icon-alert','.ui-icon-arrow-1-n','.ui-icon-arrow-1-se'];
            for (var i = 0; i < iconRules.length; i++){
               var iconSel = iconRules[i];
               captureSelector(iconSel.slice(1)+'.png',iconSel);
            }
            phantom.exit();
      }
    });
}

I'm trying to figure out how to do something like this as part of an automated acceptance test suite from a grunt task.

@nalbion see:
Wraith https://github.com/BBC-News/wraith
PhantomCSS https://github.com/Huddle/PhantomCSS

phantom.args has been removed from phantomjs 2.0 (http://phantomjs.org/api/phantom/property/args.html).

Add var system = require('system'); at the top of the file, then use system.args instead.