Your SlideShare is downloading. ×
Js unit testing
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Js unit testing


Published on

Published in: Technology

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide


  • 1. JavaScript Unit-Testing Mihail Irintchev
  • 2. How do you test your JS? 1. Write your JavaScript code 2. See if it works in your favourite browser 3. Change something + [F5] 4. If it doesn't work repeat #3 until you make it work or you go crazy... 5. In case you made it work, discover few days/weeks later that it doesn't work in another browser
  • 3. I think I'm going crazy...
  • 4. So what's the first step to sanity? WRITE TESTABLE CODE
  • 5. What's wrong with this code? js_sample_001.js (inline functions and more inside, ajax directly hooked to element, etc.)
  • 6. Anonymous functions, within functions, within functions...
  • 7. I'll put functions in your functions...
  • 8. All your DOM elements are belong to JS!
  • 9. Server URL coupling js_sample_001.js (with highlighted hardcoded url)
  • 10. Refactoring... js_sample_002.js
  • 11. Refactoring... js_sample_002.js
  • 12. Now that's better... js_sample_003.js (init func and hooked named functions to page)
  • 13. Now that's better...
  • 14. Now that's better...
  • 15. Now what about testing? Popular JS Unit-testing frameworks:  QUnit  Jasmine  UnitJS  JsUnit (no longer actively maintained)  Some other – see:
  • 16. What's about QUnit?  Used by the jQuery project to test jQuery, jQuery UI, jQuery Mobile  Can be used to test any generic JavaScript code, including itself  Very easy to install – just include JS & CSS file in your HTML
  • 17. Minimal setup: The tests.htm file
  • 18. The tests.js file ...remember this earlier?
  • 19. … and the results:
  • 20. More tests: quite a variety
  • 21. … and the results:
  • 22. Test modules ... and the results page:
  • 23. Setup / TearDown methods:
  • 24. What about asynch methods & AJAX? Use an AJAX mocking library, such as jquery-mockjax:
  • 25. No bullshit Let me show you...
  • 26. Other mock JS frameworks: -ajax
  • 27. But what about test automation?
  • 28. Why phing? 1. Because I like it and I am used to it, and... 2. PHING ALL THE THINGS!
  • 29. But phing runs in the console... JS needs browser to run in... How do we run the browser? Wouldn't it be slow?
  • 30. Need speed? Ditch the browser!
  • 31. But what about cross-browser testing?
  • 32. Credits ”Browser Eyeballing != JavaScript Testing”, Jordan Kasper ”Unit Testing JavaScript With QUnit And Phing”, Robert Price ”Qunit Phing Task”, Martin Jonsson
  • 33. Questions? @irintchev