Thomas Fuchs Presentation

2,566 views

Published on

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,566
On SlideShare
0
From Embeds
0
Number of Embeds
40
Actions
Shares
0
Downloads
75
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Thomas Fuchs Presentation

  1. 1. Thomas Fuchs Adventures in JavaScript testing
  2. 2. Thomas Fuchs wollzelle script.aculo.us mir.aculo.us
  3. 3. traditional javascript „testing“
  4. 4. http://www.flickr.com/photos/stephendann/80555607/
  5. 5. alert(“please use me only where appropriate!”);
  6. 6. why?
  7. 7. quot;JavaScript is this thing for funny mouse trails, right?quot;
  8. 8. quot;BUT You CAN't DEBUG JavaScript!quot;
  9. 9. quot;WE DON'T NEED NO STINKIN' TESTS FOR TEN LINES OF CODE!quot;
  10. 10. quot;ANYWAY, THERE IS NO WAY TO AUTOMATICALLY TEST JAVASCRIPT!quot;
  11. 11. all of this is pure FUD
  12. 12. unit testing javascript
  13. 13. s from orrow nit B est::U T
  14. 14. include unittest.js (requires Prototype)
  15. 15. a DIV is required for containing the test results (defaults to quot;testlogquot;)
  16. 16. create a new instance of Test.Unit.Runner…
  17. 17. …this will excute all methods starting with quot;testquot;
  18. 18. assert away!
  19. 19. (syntax strangeness for more convenience when calling assertions)
  20. 20. assert(expression) assert(true) => PASS assert(false) => FAIL assert(2*2==4) => PASS
  21. 21. assertEqual(expected, actual) assertEqual(‘a’,’a’) => PASS assertEqual(‘a’,’b’) => FAIL assertEqual(1,1) => PASS assertEqual(1,’1’) => PASS does not compare type
  22. 22. assertEnumEqual(expected, actual) assertEnumEqual([1,2],[1,2]) => PASS assertEqual([1,2],[1,2]) => FAIL assertEqual does not compare enum contents
  23. 23. assertNotEqual(expected, actual) assertNotEqual(‘a’,’a’) => FAIL assertNotEqual(‘a’,’b’) => PASS assertNotEqual(1,1) => FAIL assertNotEqual(1,’1’) => FAIL does not compare type
  24. 24. assertMatch(expected, actual) assertMatch(/a/,’a’) => PASS assertMatch(/a/,’bab’) => PASS assertMatch(/a/,’b’) => FAIL assertMatch(/^moo$/,’moo’) => PASS
  25. 25. assertIdentical(expected, actual) assertIdentical(‘a’,’a’) => PASS assertIdentical(1,’1’) => FAIL compares type
  26. 26. assertNotIdentical(expected, actual) assertNotIdentical(‘a’,’a’) => FAIL assertNotIdentical(1,’1’) => PASS compares type
  27. 27. assertType(expected, actual) assertType(String,’a’) => PASS assertType(Number,1) => PASS assertType(Array,[1,2]) => PASS checks for a specific constructor
  28. 28. assertRaise(exceptionName, method) assertRaise(‘ElementDoesNotExistError’, function(){ new Effect.Opacity(‘invalid-element’) } ); related effects.js code
  29. 29. assertRespondsTo(method, obj)
  30. 30. assertVisible(element) assertNotVisible(element) also checks if any parent elements are hidden and fails/passes on that
  31. 31. info(message) Displays arbitrary messages in the quot;Messagequot; column of the test result
  32. 32. assertXYZ(params, message)
  33. 33. quot;WELL, WHAT ABOUT FUNCTIONS THAT RUN ASYNCHRONOUSLY?quot;
  34. 34. wait(milliseconds, method) should be last statement in the test (but can be nested)
  35. 35. Benchmarking
  36. 36. quot;WELL, NICE. BUT IT'S TEDIOUS TO RUN ALL THOSE TESTS MANUALLY!quot;
  37. 37. rake to the rescue
  38. 38. rake test:javascripts
  39. 39. javascript_test plugin
  40. 40. rake test:javascripts 1. launches web server 2. controls browsers WEBrick lists results SUCCESS FAILURE ERROR 3. run tests
  41. 41. $ script/generate javascript_test muhaha exists test/javascript create test/javascript/muhaha_test.html
  42. 42. just add your tests
  43. 43. (symlink required: app/test/javascript/assets to app/vendor/plugins/javascript_test/assets)
  44. 44. Browser definitions (add more!)
  45. 45. $ script/plugin install http://dev.rubyonrails.org/svn/rails/plugins/javascript_test
  46. 46. …and what about BDD?
  47. 47. http://www.flickr.com/photos/sfllaw/4281980/
  48. 48. s from orrow c B RSpe
  49. 49. specifications
  50. 50. add BDD methods to any object
  51. 51. for isSomething() methods, that return a boolean
  52. 52. should* assertations, directly on objects
  53. 53. (quot;withquot; ugliness no longer required)
  54. 54. Mapping
  55. 55. Mixed environment can also use quot;normalquot; assertations
  56. 56. …and if something breaks?
  57. 57. ≈ Firebug sliced bread http://www.flickr.com/photos/teagrrl/78941282/
  58. 58. Firebug Debugger
  59. 59. Firebug know your Ajax
  60. 60. Venkman JavaScript Debugger with omes ! C filing Pro
  61. 61. Safari Web Inspector
  62. 62. Safari Debugging with Drosera
  63. 63. + http://webkit.org/
  64. 64. Microsoft Script Debugger for IE http://blogs.msdn.com/ie/archive/2004/10/26/247912.aspx
  65. 65. Test with all browsers you want to support
  66. 66. get a setup that doesn‘t suck
  67. 67. Source: http://www.flickr.com/photos/icathing/26603225/
  68. 68. + + (+ )
  69. 69. one machine to rule them all
  70. 70. help and ideas welcome #prototype (freenode) and Rails Spinoffs Google Group

×