CasperJs Enjoy Functional Testing

  • 2,028 views
Uploaded on

15'min Talk about CasperJS @ Clermont'ech

15'min Talk about CasperJS @ Clermont'ech

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,028
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
17
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. CasperJs Enjoy Functional Testing
  • 2. CasperJs Navigation scripting Testing Utility Written in Javascript Open source
  • 3. Based on PhantomJS Headless Webkit browser Full Javascript API DOM Handling CSS Selector Canvas, SVG, Screen Capture
  • 4. AND SINCE 1.1 Beta
  • 5. SlimerJS Gecko Scriptable Browser Not yet truly headless (but works with xvfb)
  • 6. PhantomJS //clermontech.js var page = new WebPage(); var result; page.open('http://clermontech.org/', function (status) { if ('success' !== status) { console.log("Error"); } else { result = page.evaluate(function () { var titles = $('.latest .talks a'); var out = []; titles.each(function () { out.push($(this).text()); }); return out.join("n"); }); console.log(result); phantom.exit(); } });
  • 7. PhantomJS fabien@fabien:~/clermontech$ phantomjs clermontech.js Organiser son Application Backbone.js Mobilité et NFC dans les Transports Introduction à Composer Ergonomie Web : Les Formulaires Back From Devoxx France 2013 Object Calisthenics Tasteful Private Cloud OVH Relax! Intro Aux Licences Libres
  • 8. CasperJs High Level API Browsing navigation steps Manage forms filling & submission Test remote DOM Logging events Downloading resources Make some screenshot Write functional tests suites
  • 9. Functional Testing ? Functional tests check the integration of the different layers of an application (from the routing to the views). Test your business rules Test the integration of your pages
  • 10. Example //clermontech_casper.js var casper = require('casper').create(); casper.start('http://clermontech.org', function() { this.test.assertHttpStatus(200, 'Homepage is UP !'); this.echo('We click on Link Association'); this.click('a[title="A propos de Clermont'ech"]'); }); casper.wait('2000', function(){ this.test.assertHttpStatus(200, 'Association page is UP !'); this.test.assertUrlMatch(/association/, 'Url is well formed'); var members = this.evaluate(function() { return __utils__.findAll('.row .container ul li').length; }); this.test.assertEquals(6, members, '6 members in the association'); this.test.assertTextExists('Julien Maupetit', 'We found Mr President'); }); casper.run(function(){ this.test.done(); });
  • 11. Execution
  • 12. Selectors CSS3 Xpath casper.start('http://clermontech.org', function() { this.test.assertExists({ type: 'xpath', path: '//*[@id="logo"]' }, 'the logo exists'); });
  • 13. Beautifull Screenshot casper.start('http://clermontech.org/', function() { this.captureSelector('clermontech.png', 'body'); }); casper.run();
  • 14. Tools Resurrectio Chrome extension Record navigation and generate casperjs test suites GNU/Parallel Parallelize test suites
  • 15. @fabienpomerol Thank you Questions ?