The document discusses PhantomJS, a headless WebKit browser that can be programmed using JavaScript, and outlines how to install and utilize it for tasks like taking screenshots and performance monitoring. It also introduces CasperJS, which serves as a testing framework on top of PhantomJS, offering functionalities for simulating user interactions and assertions. Installation instructions and code examples for both tools are provided, along with references for further information.

1. http://x-team.com
PhantomJS
CasperJS

2. http://x-team.com
PhantomJS
• Headless version of Webkit
• Window-less, command line
web browser
• Programmable through
JavaScript
• Supports WebDriver out of the
box

3. http://x-team.com
Installation
• Install Node.js
• sudo npm install -g phantomjs
• (http://phantomjs.org/)

4. 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();
});

5. 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

6. http://x-team.com
What else can i do ?
• Inject/execute arbitrary JS
code
• Perform actions
• Take screenshots
• Monitor performance

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

8. 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.

9. http://x-team.com
Installation
• Install Node.js
• sudo npm install -g casperjs
• (http://casperjs.org/)

10. 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();

11. 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

12. 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

13. References
• http://docs.casperjs.org/en/latest/
• http://phantomjs.org/documentation/
• https://github.com/BBC-News/wraith

14. http://x-team.com
Crash Courses