CasperJS and PhantomJS for Automated Testing

http://x-team.com

PhantomJS CasperJS

http://x-team.com

PhantomJS

• Headless version of Webkit

• Window-less, command line web browser

• Programmable through JavaScript

• Supports WebDriver out of the box

http://x-team.com

Installation

• Install Node.js

• sudo npm install -g phantomjs

• (http://phantomjs.org/)

How to use it?

var page = require('webpage').create();

page.open('http://www.google.com/', function (status) {

// Page is loaded. Output content.

console.log(page.content);

phantom.exit();

});

How to use it?

var page = require('webpage').create();

page.open('http://www.google.com/', function (status) {

// Page is loaded. Output content.

console.log(page.content);

phantom.exit();

});

> phantomjs myscript.js

http://x-team.com

What else can i do ?

• Inject/execute arbitrary JS code

• Perform actions

• Take screenshots

• Monitor performance

PhantomJS is not a test framework. It’s a virtual browser.

http://x-team.com

CasperJS

• API & test framework layer on top of PhantomJS

• Provides all the things you’re used to:

• Clicking, Typing, Waiting, Assertions, etc.

• Events, screenshots (even specific elements), & more.

http://x-team.com

Installation

• Install Node.js

• sudo npm install -g casperjs

• (http://casperjs.org/)

How to use it?

var casper = require('casper').create();

casper.start('http://google.com/', function() {

this.fill('form[action="/search"]', { 'q': 'ghost' });

this.click('#gbqfba');

});

casper.then(function() {

this.echo(this.getTitle());

});

casper.run();

How to use it?var casper = require('casper').create();

casper.start('http://google.com/', function() {

this.fill('form[action="/search"]', { 'q': 'ghost' });

this.click('#gbqfba');

});

casper.then(function() {

this.echo(this.getTitle());

});

casper.run();

#> casperjs myscript.js

How to use it?

var casper = require('casper').create();

casper.test.begin('Google tests', 1, function(test) {

casper.start('http://www.google.com/', function() {

test.assertTitleMatch(/Google/, 'Title contains Google');

}).run(function() {

test.done();

});

});

#> casperjs myscript.js

References

• http://docs.casperjs.org/en/latest/

• http://phantomjs.org/documentation/

• https://github.com/BBC-News/wraith

http://x-team.comCrash Courses