SlideShare a Scribd company logo
LIKE A GENIE FROM THE LAMP
    Headless JavaScript Testing with Jasmine and PhantomJS




Rob Friesel                                     @founddrama
WHO IS THIS GUY?

• Sr. User
         Interface Developer
 at Dealer.com Websystems

• out   there on the web:

  • @founddrama

  • blog.founddrama.net

  • github.com/founddrama
WHAT ARE WE TALKING
  ABOUT TODAY?
IN THE BEGINNING...
But then we discover...

UNIT TESTING
BENEFITS OF UNIT TESTING
DEMO
SO WHAT'S THE PROBLEM?
AUTOMATION
var page = new WebPage();
  page.onConsoleMessage = function(msg) {
    console.log(msg);
  };

  console.log('[phantomjs] Loading page...');

  page.open(encodeURI('http://blog.founddrama.net/'), function(status){
   if (status !== 'success') {
     console.log('could not retrieve!');
    } else {
      page.evaluate(function(){
       console.log('[phantomjs] Querying for post titles...');
       var list = Array.prototype.slice.call(
                           document.querySelectorAll('h2 > a[rel="bookmark"]'), 0);
       console.log('[phantomjs] ' + list.length + ' post titles:');
        list.forEach(function(el){
         console.log(' ' + el.innerHTML.replace(/<.*?>/g, ''));
       });
      });
    }
   phantom.exit();
  });
ARE YOU THINKING
WHAT I'M THINKING?
LET'S DO SOMETHING
      AWESOME!
QUESTIONS?
THANKS!
RESOURCES

• Jasmine    : http://pivotal.github.com/jasmine/

• PhantomJS     : http://phantomjs.org/

• Larry   Myers' jasmine-reporters :

 https://github.com/larrymyers/jasmine-reporters

• this   talk's sample code :

 https://github.com/founddrama/vt-code-camp-2012

More Related Content

What's hot

Javascript Test Automation Workshop (21.08.2014)
Javascript Test Automation Workshop (21.08.2014)Javascript Test Automation Workshop (21.08.2014)
Javascript Test Automation Workshop (21.08.2014)
Deutsche Post
 
Роман Лютиков "Web Apps Performance & JavaScript Compilers"
Роман Лютиков "Web Apps Performance & JavaScript Compilers"Роман Лютиков "Web Apps Performance & JavaScript Compilers"
Роман Лютиков "Web Apps Performance & JavaScript Compilers"
Fwdays
 
[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)
[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)
[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)
Scrum Breakfast Vietnam
 
Testing frontends with nightwatch & saucelabs
Testing frontends with nightwatch & saucelabsTesting frontends with nightwatch & saucelabs
Testing frontends with nightwatch & saucelabs
Tudor Barbu
 
Jasmine with JS-Test-Driver
Jasmine with JS-Test-DriverJasmine with JS-Test-Driver
Jasmine with JS-Test-Driver
Devesh Chanchlani
 
Selenium Automation Using Ruby
Selenium Automation Using RubySelenium Automation Using Ruby
Selenium Automation Using RubyKumari Warsha Goel
 
Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"
Fwdays
 
The Road to Native Web Components
The Road to Native Web ComponentsThe Road to Native Web Components
The Road to Native Web Components
Mike North
 
Mojolicious
MojoliciousMojolicious
Mojolicious
Marcus Ramberg
 
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Fwdays
 
Django rest framework tips and tricks
Django rest framework   tips and tricksDjango rest framework   tips and tricks
Django rest framework tips and tricks
xordoquy
 
Unit Testing With Javascript
Unit Testing With JavascriptUnit Testing With Javascript
Unit Testing With Javascript
thedumbterminal
 
Rails Presentation (Anton Dmitriyev)
Rails Presentation (Anton Dmitriyev)Rails Presentation (Anton Dmitriyev)
Rails Presentation (Anton Dmitriyev)True-Vision
 
Test-Driven JavaScript Development (JavaZone 2010)
Test-Driven JavaScript Development (JavaZone 2010)Test-Driven JavaScript Development (JavaZone 2010)
Test-Driven JavaScript Development (JavaZone 2010)
Christian Johansen
 
Puppeteer - Headless Chrome Node API
Puppeteer - Headless Chrome Node APIPuppeteer - Headless Chrome Node API
Puppeteer - Headless Chrome Node API
Wilson Su
 
AppengineJS
AppengineJSAppengineJS
AppengineJS
Panagiotis Astithas
 
"Augmented reality in your browser", Alina Karpelceva
"Augmented reality in your browser", Alina Karpelceva"Augmented reality in your browser", Alina Karpelceva
"Augmented reality in your browser", Alina Karpelceva
Fwdays
 
Puppeteer
PuppeteerPuppeteer
Puppeteer
Adrian Caetano
 

What's hot (20)

Javascript Test Automation Workshop (21.08.2014)
Javascript Test Automation Workshop (21.08.2014)Javascript Test Automation Workshop (21.08.2014)
Javascript Test Automation Workshop (21.08.2014)
 
Роман Лютиков "Web Apps Performance & JavaScript Compilers"
Роман Лютиков "Web Apps Performance & JavaScript Compilers"Роман Лютиков "Web Apps Performance & JavaScript Compilers"
Роман Лютиков "Web Apps Performance & JavaScript Compilers"
 
[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)
[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)
[DN Scrum Breakfast] Protractor: E2E Testing for AngularJS (by Thuy Nguyen)
 
Testing frontends with nightwatch & saucelabs
Testing frontends with nightwatch & saucelabsTesting frontends with nightwatch & saucelabs
Testing frontends with nightwatch & saucelabs
 
CasperJS
CasperJSCasperJS
CasperJS
 
Fav
FavFav
Fav
 
Jasmine with JS-Test-Driver
Jasmine with JS-Test-DriverJasmine with JS-Test-Driver
Jasmine with JS-Test-Driver
 
Selenium Automation Using Ruby
Selenium Automation Using RubySelenium Automation Using Ruby
Selenium Automation Using Ruby
 
Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"Philip Shurpik "Architecting React Native app"
Philip Shurpik "Architecting React Native app"
 
The Road to Native Web Components
The Road to Native Web ComponentsThe Road to Native Web Components
The Road to Native Web Components
 
Mojolicious
MojoliciousMojolicious
Mojolicious
 
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
Игорь Фесенко "Web Apps Performance & JavaScript Compilers"
 
Django rest framework tips and tricks
Django rest framework   tips and tricksDjango rest framework   tips and tricks
Django rest framework tips and tricks
 
Unit Testing With Javascript
Unit Testing With JavascriptUnit Testing With Javascript
Unit Testing With Javascript
 
Rails Presentation (Anton Dmitriyev)
Rails Presentation (Anton Dmitriyev)Rails Presentation (Anton Dmitriyev)
Rails Presentation (Anton Dmitriyev)
 
Test-Driven JavaScript Development (JavaZone 2010)
Test-Driven JavaScript Development (JavaZone 2010)Test-Driven JavaScript Development (JavaZone 2010)
Test-Driven JavaScript Development (JavaZone 2010)
 
Puppeteer - Headless Chrome Node API
Puppeteer - Headless Chrome Node APIPuppeteer - Headless Chrome Node API
Puppeteer - Headless Chrome Node API
 
AppengineJS
AppengineJSAppengineJS
AppengineJS
 
"Augmented reality in your browser", Alina Karpelceva
"Augmented reality in your browser", Alina Karpelceva"Augmented reality in your browser", Alina Karpelceva
"Augmented reality in your browser", Alina Karpelceva
 
Puppeteer
PuppeteerPuppeteer
Puppeteer
 

Similar to Like a Genie from a Lamp: Headless JavaScript Unit Testing with Jasmine and PhantomJS

Unit Testing JavaScript Applications
Unit Testing JavaScript ApplicationsUnit Testing JavaScript Applications
Unit Testing JavaScript Applications
Ynon Perek
 
5 Tips for Better JavaScript
5 Tips for Better JavaScript5 Tips for Better JavaScript
5 Tips for Better JavaScript
Todd Anglin
 
JS class slides (2016)
JS class slides (2016)JS class slides (2016)
JS class slides (2016)
Yves-Emmanuel Jutard
 
JS Class 2016
JS Class 2016JS Class 2016
JS Class 2016
Yves-Emmanuel Jutard
 
Your Library Sucks, and why you should use it.
Your Library Sucks, and why you should use it.Your Library Sucks, and why you should use it.
Your Library Sucks, and why you should use it.Peter Higgins
 
Week 4 - jQuery + Ajax
Week 4 - jQuery + AjaxWeek 4 - jQuery + Ajax
Week 4 - jQuery + Ajaxbaygross
 
Beyond Page Level Metrics
Beyond Page Level MetricsBeyond Page Level Metrics
Beyond Page Level Metrics
Philip Tellis
 
How to actually use promises - Jakob Mattsson, FishBrain
How to actually use promises - Jakob Mattsson, FishBrainHow to actually use promises - Jakob Mattsson, FishBrain
How to actually use promises - Jakob Mattsson, FishBrain
Codemotion Tel Aviv
 
Javascript testing should be awesome
Javascript testing should be awesomeJavascript testing should be awesome
Javascript testing should be awesome
Abderrazak BOUADMA
 
JavaScript ES6
JavaScript ES6JavaScript ES6
JavaScript ES6
Leo Hernandez
 
The Spirit of Testing
The Spirit of TestingThe Spirit of Testing
The Spirit of Testing
Marco Cedaro
 
Cross Domain Web
Mashups with JQuery and Google App Engine
Cross Domain Web
Mashups with JQuery and Google App EngineCross Domain Web
Mashups with JQuery and Google App Engine
Cross Domain Web
Mashups with JQuery and Google App Engine
Andy McKay
 
Web Crawling with NodeJS
Web Crawling with NodeJSWeb Crawling with NodeJS
Web Crawling with NodeJS
Sylvain Zimmer
 
Great Developers Steal
Great Developers StealGreat Developers Steal
Great Developers Steal
Ben Scofield
 
Even Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax ExperienceEven Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax Experience
Steve Souders
 
Build web application by express
Build web application by expressBuild web application by express
Build web application by expressShawn Meng
 
JavaScript Async for Effortless UX
JavaScript Async for Effortless UXJavaScript Async for Effortless UX
JavaScript Async for Effortless UX
재석 강
 

Similar to Like a Genie from a Lamp: Headless JavaScript Unit Testing with Jasmine and PhantomJS (20)

Unit Testing JavaScript Applications
Unit Testing JavaScript ApplicationsUnit Testing JavaScript Applications
Unit Testing JavaScript Applications
 
5 Tips for Better JavaScript
5 Tips for Better JavaScript5 Tips for Better JavaScript
5 Tips for Better JavaScript
 
All of javascript
All of javascriptAll of javascript
All of javascript
 
JS class slides (2016)
JS class slides (2016)JS class slides (2016)
JS class slides (2016)
 
All of Javascript
All of JavascriptAll of Javascript
All of Javascript
 
JS Class 2016
JS Class 2016JS Class 2016
JS Class 2016
 
Your Library Sucks, and why you should use it.
Your Library Sucks, and why you should use it.Your Library Sucks, and why you should use it.
Your Library Sucks, and why you should use it.
 
Week 4 - jQuery + Ajax
Week 4 - jQuery + AjaxWeek 4 - jQuery + Ajax
Week 4 - jQuery + Ajax
 
Beyond Page Level Metrics
Beyond Page Level MetricsBeyond Page Level Metrics
Beyond Page Level Metrics
 
How to actually use promises - Jakob Mattsson, FishBrain
How to actually use promises - Jakob Mattsson, FishBrainHow to actually use promises - Jakob Mattsson, FishBrain
How to actually use promises - Jakob Mattsson, FishBrain
 
Javascript testing should be awesome
Javascript testing should be awesomeJavascript testing should be awesome
Javascript testing should be awesome
 
JavaScript ES6
JavaScript ES6JavaScript ES6
JavaScript ES6
 
The Spirit of Testing
The Spirit of TestingThe Spirit of Testing
The Spirit of Testing
 
Node.js
Node.jsNode.js
Node.js
 
Cross Domain Web
Mashups with JQuery and Google App Engine
Cross Domain Web
Mashups with JQuery and Google App EngineCross Domain Web
Mashups with JQuery and Google App Engine
Cross Domain Web
Mashups with JQuery and Google App Engine
 
Web Crawling with NodeJS
Web Crawling with NodeJSWeb Crawling with NodeJS
Web Crawling with NodeJS
 
Great Developers Steal
Great Developers StealGreat Developers Steal
Great Developers Steal
 
Even Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax ExperienceEven Faster Web Sites at The Ajax Experience
Even Faster Web Sites at The Ajax Experience
 
Build web application by express
Build web application by expressBuild web application by express
Build web application by express
 
JavaScript Async for Effortless UX
JavaScript Async for Effortless UXJavaScript Async for Effortless UX
JavaScript Async for Effortless UX
 

Recently uploaded

Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
Bhaskar Mitra
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
Product School
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
Ralf Eggert
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance
 
ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
CatarinaPereira64715
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
Jemma Hussein Allen
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Jeffrey Haguewood
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
Alan Dix
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
Abida Shariff
 
Key Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfKey Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdf
Cheryl Hung
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
Product School
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
Sri Ambati
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
DanBrown980551
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
Alison B. Lowndes
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
Thijs Feryn
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
91mobiles
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Ramesh Iyer
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
Guy Korland
 

Recently uploaded (20)

Search and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical FuturesSearch and Society: Reimagining Information Access for Radical Futures
Search and Society: Reimagining Information Access for Radical Futures
 
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
De-mystifying Zero to One: Design Informed Techniques for Greenfield Innovati...
 
PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)PHP Frameworks: I want to break free (IPC Berlin 2024)
PHP Frameworks: I want to break free (IPC Berlin 2024)
 
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdfFIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
FIDO Alliance Osaka Seminar: Passkeys and the Road Ahead.pdf
 
ODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User GroupODC, Data Fabric and Architecture User Group
ODC, Data Fabric and Architecture User Group
 
The Future of Platform Engineering
The Future of Platform EngineeringThe Future of Platform Engineering
The Future of Platform Engineering
 
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdfFIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
FIDO Alliance Osaka Seminar: The WebAuthn API and Discoverable Credentials.pdf
 
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
Slack (or Teams) Automation for Bonterra Impact Management (fka Social Soluti...
 
Epistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI supportEpistemic Interaction - tuning interfaces to provide information for AI support
Epistemic Interaction - tuning interfaces to provide information for AI support
 
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptxIOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
IOS-PENTESTING-BEGINNERS-PRACTICAL-GUIDE-.pptx
 
Key Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdfKey Trends Shaping the Future of Infrastructure.pdf
Key Trends Shaping the Future of Infrastructure.pdf
 
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdfFIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
FIDO Alliance Osaka Seminar: Passkeys at Amazon.pdf
 
How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...How world-class product teams are winning in the AI era by CEO and Founder, P...
How world-class product teams are winning in the AI era by CEO and Founder, P...
 
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
GenAISummit 2024 May 28 Sri Ambati Keynote: AGI Belongs to The Community in O...
 
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
LF Energy Webinar: Electrical Grid Modelling and Simulation Through PowSyBl -...
 
Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........Bits & Pixels using AI for Good.........
Bits & Pixels using AI for Good.........
 
Accelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish CachingAccelerate your Kubernetes clusters with Varnish Caching
Accelerate your Kubernetes clusters with Varnish Caching
 
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdfSmart TV Buyer Insights Survey 2024 by 91mobiles.pdf
Smart TV Buyer Insights Survey 2024 by 91mobiles.pdf
 
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
Builder.ai Founder Sachin Dev Duggal's Strategic Approach to Create an Innova...
 
GraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge GraphGraphRAG is All You need? LLM & Knowledge Graph
GraphRAG is All You need? LLM & Knowledge Graph
 

Like a Genie from a Lamp: Headless JavaScript Unit Testing with Jasmine and PhantomJS

  • 1. LIKE A GENIE FROM THE LAMP Headless JavaScript Testing with Jasmine and PhantomJS Rob Friesel @founddrama
  • 2. WHO IS THIS GUY? • Sr. User Interface Developer at Dealer.com Websystems • out there on the web: • @founddrama • blog.founddrama.net • github.com/founddrama
  • 3. WHAT ARE WE TALKING ABOUT TODAY?
  • 5. But then we discover... UNIT TESTING
  • 6.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12. DEMO
  • 13. SO WHAT'S THE PROBLEM?
  • 15.
  • 16. var page = new WebPage(); page.onConsoleMessage = function(msg) {   console.log(msg); }; console.log('[phantomjs] Loading page...'); page.open(encodeURI('http://blog.founddrama.net/'), function(status){    if (status !== 'success') {      console.log('could not retrieve!');   } else {     page.evaluate(function(){        console.log('[phantomjs] Querying for post titles...');        var list = Array.prototype.slice.call( document.querySelectorAll('h2 > a[rel="bookmark"]'), 0);        console.log('[phantomjs] ' + list.length + ' post titles:');       list.forEach(function(el){          console.log(' ' + el.innerHTML.replace(/<.*?>/g, ''));        });     });   }    phantom.exit(); });
  • 17. ARE YOU THINKING WHAT I'M THINKING?
  • 18. LET'S DO SOMETHING AWESOME!
  • 21. RESOURCES • Jasmine : http://pivotal.github.com/jasmine/ • PhantomJS : http://phantomjs.org/ • Larry Myers' jasmine-reporters : https://github.com/larrymyers/jasmine-reporters • this talk's sample code : https://github.com/founddrama/vt-code-camp-2012

Editor's Notes

  1. - first off: thanks\n- second: sorry about the cheesy title\n-- (trying to be clever, just sounds lame)\n
  2. - other claims to fame:\n-- jshint contributor (flyweight category)\n-- helped to do some of the editing for Nicholas Zakas&apos; Pro JS for WebDev (3rd Ed.)\n
  3. - per title: &quot;headless JavaScript unit testing&quot;\n- and our toolkit? *Jasmine* and *PhantomJS*\n- (reliable) testing for your front-end code\n
  4. - You&apos;re just clicking around, right?\n- crude methods\n
  5. - &quot;Anyone *not* know what unit testing is?&quot;\n-- (brief explanation) or: &quot;I&apos;ll skip the primer on unit testing...&quot;\n
  6. - &quot;And of course we can even go all the way to TDD...&quot;\n-- &quot;but let&apos;s stay out of that discussion today...&quot;\n\n
  7. - (self-explanatory?)\n- more confident about the changes you make\n- more confident in the changes *others* make\n- builds business value b/c you can &quot;prove&quot; stability\n- [ASK] What else?\n
  8. &quot;And now for a brief overview of the JS unit testing landscape!&quot;\n\n- &quot;If you&apos;ve unit tested in other languages before...&quot; (usually a clear winner)\n-- results of my *totally unscientific survey*:\n--- Java: JUnit\n--- Groovy: Spock\n--- Ruby: RSpec\n--- .NET: NUnit\n--- Scala: specs\n\n&quot;...the JavaScript unit testing landscape is... less clear...&quot;\n
  9. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  10. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  11. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  12. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  13. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  14. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  15. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  16. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  17. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  18. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  19. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  20. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  21. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  22. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  23. - Wikipedia article: &apos;Unit testing frameworks&apos;: table features **35** diff. unit testing fwks for JS. (not even an exhaustive list)\n-- here&apos;s just a few...\n- &quot;The community doesn&apos;t really rally around any one solution...&quot;\n-- &quot;depends on what you&apos;re doing&quot; (browser? node? some specific library?)\n-- most claim fwk/lib agnostic (&quot;but find me someone using DOH on non-Dojo)\n-- sidebar re: Ben Cherry&apos;s &quot;Writing Testable JavaScript&quot;?\n-- and/but: at some point you just need to pick one...\n
  24. - Q. &quot;Why Jasmine?&quot;\n-- (funny) A. &quot;Well, you gotta pick something...&quot;\n-- (real) A. &quot;BDD&quot;\n- Q. &quot;What is BDD?&quot; A. &quot;Behavior Driven Development&quot;\n-- testing/dev methodology based loosely on TDD\n-- main difference? (as I understand it) &quot;natural language&quot; approach\n--- tests are written as &quot;behaviors&quot; - can (should!) be written by the BA\n--- ...and easily converted into tests (write your tests with your BAs)\n
  25. DEMO : alt-tab\n- explain our utility lib + math lib\n- explain our specs/tests\n- &quot;just scratching the surface of Jasmine here&quot;\n- DON&apos;T FORGET: passing tests aren&apos;t interesting\n-- make a few fail (have some failing to start with)\n- discussion? other ones we can write?\n-- max() test w/ negative numbers\n-- max w/ `0e0` formatted numbers\n-- max test w/ `Infinity`\n\n
  26. &quot;So now we have some unit tests -- and that&apos;s a big improvement.&quot;\n\n** BUT: **\n- this approach is not w/o its problems\n-- [ASK] chief among them? (what do you think?)\n-- you&apos;re doing it in the browser (so *that&apos;s* slow...)\n- and even if you could tolerate that... (reloading the page over and over...)\n-- ( to say nothing of dealing with multiple browsers )\n- ...what about automation? ...what about continuous integration?\n\n
  27. AUTOMATION + CI\n\n&quot;A little bit of a sidebar...&quot; (but not much)\n\n- mention: Selenium, WebDriver, Geb\n- mention: BusterJS\n- mention notion of &quot;browser lab&quot;\n- *but* - &quot;These are cumbersome, slow, expensive...&quot;\n-- and most of the time it&apos;s overkill\n--- esp. for quick tests on your dev box\n
  28. &quot;PhantomJS!&quot;\n- Q. &quot;What is PhantomJS?&quot; A. &quot;headless WebKit&quot; (plus explanation)\n-- *aside:* you can use it for just about anything...\n- Q. &quot;How does this help us?&quot;\n-- 1. A. &quot;Gets you out of the browser refresh game.&quot;\n-- 2. A. &quot;Sets you up for a CI strategy.&quot;\n\n- **sidebar:** won&apos;t solve all your problems; running tests in PhantomJS is like running then &quot;just in Chrome&quot; -- and it has everything that a browser has *except* an actual &quot;physical&quot; viewport (use in conjunction w/ JSHint and your regular QA)\n-- (not pictured) : imagine : add Grunt? add a watch script? connect to something like Growl?\n\n- Q. &quot;How do you interact with PhantomJS?&quot;\n-- A. (show a &quot;hello world&quot; type example and introduce the API)\n\n
  29. - walkthrough\n-- WebPage\n-- explain what this does (which isn&apos;t much)\n-- but enough to introduce the API\n
  30. - &quot;Are you thinking what I&apos;m thinking?&quot;\n-- we have some interesting tools here\n-- we could really cobble something together...\n-- ...to solve that CI problem\n- &quot;...fortunately...&quot;\n-- Larry Myers has done most of the heavy-lifting for us already\n- so we have:\n-- Jasmine (test framework)\n-- PhantomJS (test environment)\n-- Larry Myers&apos; jasmine-reporters (adapter + test runner)\n
  31. - demo!\n- cheat sheet:\n-- $ phantomjs lib/jasmine-reporters/test/phantomjs-testrunner.js $(pwd)/test/all-tests-spec.htm\n-- remember: make sure that you fail some tests too\n-- remember: use `echo $?` to show the exit codes...\n- &quot;Writing scripts around this can be trivial...&quot;\n-- see also: it&apos;s also possible to wrap the tests with test runners (e.g., to run the tests as part of your regular CI tests...)\n- NOT going to actually stand up Jenkins or anything like that...\n-- &quot;But you get the idea...&quot;\n
  32. \n
  33. \n
  34. \n