Your SlideShare is downloading. ×
JavaScript Unit Testing
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

JavaScript Unit Testing

4,131
views

Published on

A short presentation on three different takes on JavaScript Unit Testing

A short presentation on three different takes on JavaScript Unit Testing


0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
4,131
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
47
Comments
0
Likes
4
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. JavaScript Unit Testing Tools to support JavaScript TDD
  • 2. Overview - Tools
      • JsUnitTest
      • BlueRidge (For Rails)
      • JsTestDriver
  • 3. Overview - Techniques
      • "Normal tests"
      • Asynchronous Tests
      • User actions
      • Mocking
  • 4. JsUnitTest
      • http://jsunittest.com
      • Originates from Prototype.js
      • Standalone
      • Uses a fixture (loaded in browser), a JS file and a CSS file
  • 5. JsUnitTest Example
      • Simple test: String.prototype.trim
      • Fail and succeed
      • JavaScript property names as strings improves readability
  • 6. JsContext
    • Simple add-on to get basic contexts and tests starting with "should"
    • http://gitorious.org/jscontext/jscontext
  • 7. Asynchronous Test
      • XmlHttpRequest
      • Animations
      • Timeouts
      • More
  • 8. Async Test Problem
      • Assertion(s) run after test has completed
      • Test passes(!)
      • Pay attention to the number of assertions
  • 9. Async Test Solution
      • Setup test, call async method
      • wait()
      • Assert in callback
      • Pauses test for x ms
  • 10. User Actions
    • YUI Framework to the rescue
    • http://developer.yahoo.com/yui/yuitest/#useractions
    • YAHOO.util.UserAction
      • click
      • dblclick
      • mousedown
      • mouseup
      • mouseover
      • mouseout
      • mousemove
  • 11. UserAction example
      • Using YUI Test
  • 12. Providing Event Data
      • detail - # of clicks
      • screenX/screenY - mouse coordinates (screen)
      • clientX/clientY - mouse coordinates (client area)
      • ctrlKey, altKey, shiftKey, metaKey (true means down)
      • button - 0 left, 1 right, 2 middle
      • relatedTarget - element mouse moved from YAHOO.util.Event.getRelatedTarget()
      • keyCode
  • 13. JsUnitTest Pros
      • Simple
      • Requires little setup
      • Run in any browser
  • 14. JsUnitTest Cons
      • Doesn't scale
      • Requires browser interaction
      • F5, F5, F5
      • Uses fixtures
  • 15. Similar Offerings
    • QUnit
    • http://docs.jquery.com/QUnit
    • YUI Test
    • http://developer.yahoo.com/yui/yuitest/
    • JsUnit
    • http://www.jsunit.net
    • JsSpec
    • http://jania.pe.kr/aw/moin.cgi/JSSpec
  • 16. BlueRidge
    • Testing cocktail, "convention over configuration" flavoured, for Rails
      • Rhino - Java-based JavaScript interpretor
      • Screw.Unit - RSpec-like BDD framework for JavaScript
      • Smoke - Mocha-like mocking framework
      • env.js - JavaScript DOM implementation
    • script/plugin install git://github.com/relevance/blue-ridge.git
    • script/generate blue_ridge
  • 17. BlueRidge tools
    • script/generate javascript_spec mylib
    • rake test:javascripts TEST=application
    • rake js:fixtures
    • rake js:shell
  • 18. BlueRidge Directories
    • test/javascripts
    • spec/javascripts OR examples/javascripts
    • javascripts/fixtures
  • 19. BlueRidge Demo
    • Double-click to add text
  • 20. BlueRidge + Prototype
    • jQuery.noConflict();
    • require
    • (Demo)
  • 21. BlueRidge Pros
      • Easy to setup
      • Command line interaction
      • Integrated with Rails
  • 22. BlueRidge Cons
      • Doesn't use real browser engines
      • In browser: Same as JsUnitTest
  • 23. JsTestDriver
      • From Google
      • Server and Ajax communicates with browsers
      • Completely command-line driven
      • Eclipse-plugin
      • Easy to test several platforms simultaneously and INSTANTLY
  • 24. JsTestDriver.conf
    • server: http://localhost:4224
    • load:
    • - src/*.js
    • - test/*.js
  • 25. JsTestDriver demo
    • Double-click to add text
  • 26. JsTestDriver Server
      • Can run server anywhere
      • Can connect any number of browsers on any number of systems
      • Tests run quickly
      • Any number of developers can run their tests on the same server
  • 27. JsTestDriver Gem
      • Easier to remember command: jstestdriver
      • Red and green , baby
      • Autotest hook
  • 28. JsTestDriver Pros
      • Completely commandline based
      • Runs in actual browsers
      • Scales!
      • Several platforms simultaneously
      • Can run any assertion framework
  • 29. JsTestDriver Cons
      • Beta, slightly buggy (occasionally drops clients++)
      • No asynchronous tests (AFAIK)
  • 30. That's All, Folks
    • http://cjohansen.no/
    • [email_address]
    • Book out next year
    • http://gitorious.org/javascript-unit-testing