The Spirit of Testing

976 views

Published on



Front-end Javascript testing is a thing since 3/4 years now, but it’s still a ghost in the dev community: someone believes in it while someone else is not convinced at all.

This talk will tackle the misconceptions about testing, how and what to test, dependencies mocking and strategies to write tests in a profitable way without being afraid.

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

  • Be the first to like this

No Downloads
Views
Total views
976
On SlideShare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
0
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

The Spirit of Testing

  1. 1. The Spirit of Testing
  2. 2. The Spirit of Testing
  3. 3. Testing? I’m bored already http://stockarch.com/images/events/bored-halloween-ghost-6068
  4. 4. DON’T
  5. 5. Testing should be Appealing http://gossip.whyfame.com/demi-moore-and-whoopi-goldberg-pay-tribute-to-ghost-co-star-patrick-swayze-613
  6. 6. “Testing is like sex. If it’s not fun, then you’re doing it wrong” – anonymous
  7. 7. http://writingisacompulsion.blogspot.co.uk/2013/10/9-months-in-making-baby-of-thought.html
  8. 8. Remember being a kid? https://parentsavvy.com/child-health/?SubtopicId=30014,30017&DocId=1,2954
  9. 9. Kids run tests every moment http://www.psychalive.org/category/tantrums-2/ http://www.patrasevents.gr/article/100447-deite-tin-apisteuti-antidrasi-apo-morakia-pou-dokimazoun-lemoni-video
  10. 10. They are the best at it http://www.childrensdayton.org/cms/images/a0f6b517aba16ca5/index.html
  11. 11. They explore the unknowns http://www.childrensdayton.org/cms/images/a0f6b517aba16ca5/index.html
  12. 12. embrace you don’t know either
  13. 13. Through tests we sense the unknowns http://www.dailymail.co.uk/news/article-2381456/How-science-spirit-world-really-makes-Ouija-board-dowsing-rods-move.html
  14. 14. (re)think Testing
  15. 15. you are testing already 
 (even if you are not) http://www.hongkiat.com/blog/developer-habits/
  16. 16. you might just need to formalise http://www.wisegeek.org/what-is-procedural-programming.htm
  17. 17. to, eventually, forget this (almost) https://twitter.com/fredzen/status/439774520111419392
  18. 18. What is not about Task runner Test Runner Testing Platforms Assertion Frameworks IDEs integration http://strongenough-christina.blogspot.co.uk/2012/10/my-tool-belt.html
  19. 19. What it is about http://www.sourcecon.com/news/2010/11/19/sourcing-a-passing-fad-or-a-strategic-move/
  20. 20. I Build So Consistently share Identify what to automate create a 
 build script make it continuous
  21. 21. “[…] On several occasions I've heard the reply, "Yes, we do CI." 
 Of course, I think, "Great!" and then 
 ask a few questions. 
 How much code coverage do you have with your tests? How long does it take to run your builds? What is your average code complexity? How much code duplication do you have?” – Paul Duvall
  22. 22. to DTU* or not to DTU*?
 (* Define Tests Upfront: tdd / bdd / acceptance) http://comicsalliance.com/ryan-north-to-be-or-not-to-be-kickstarter-sets-record/
  23. 23. any test is better than no tests, but…
  24. 24. Confirmation bias http://www.thezerosbeforetheone.com/confirming-my-own-confirmation-bias
  25. 25. “it is a byproduct of test-after- development and manifests itself as the tendency for engineers to only write tests that they know pass.” – Paul Bourdeaux 
 http://www.sundoginteractive.com/sunblog/posts/confirmation-bias-in-unit-testing
  26. 26. Code Review vs Pairing http://powerbuilder.us/ http://meetingking.com/mini-meetings-or-pair-programming/
  27. 27. Error Management http://comicbooks.about.com/od/ghostrid2/ig/Ghost-Rider-Movie-Gallery/Ghost-Rider-Johnny-Blaze.htm
  28. 28. Feedback loop http://www.smashingmagazine.com/2013/02/15/designing-great-feedback-loops/
  29. 29. Testing is a way to shape your process, not only your workflow
  30. 30. what I learned so far
  31. 31. @cedmax turning blank files to bugs since 2003
  32. 32. webteam @ Shazam
  33. 33. When I started testing http://quoteko.com/lego-block.html http://karenchilvers.mycouncillor.org.uk/2013/09/28/planning-applications-week-ending-27th-september-2013/
  34. 34. There is actually much more Unit Behaviour Acceptance Usability System Integration Performance UI Security Scalability …
  35. 35. How I see it now Automatable !Automatable Feature Code Unit Acceptance Usability Code Review Linting Styleguide Integration QA Testing
  36. 36. Testing code IS appealing (or I have some mom issues, pick one) http://gossip.whyfame.com/demi-moore-and-whoopi-goldberg-pay-tribute-to-ghost-co-star-patrick-swayze-613
  37. 37. “Egoism is the very essence of a noble soul.” – Friedrich Nietzsche
  38. 38. Interlude How I Learned to Stop Worrying and Love the DOM
  39. 39. The curious case of Javascript unit testing Unit testing is supposed to test a single atomic “unit” of functionality without dependencies on anything else This is where you start to run into serious dependency problems due to the interrelation HTML and CSS What do you test? Usually how the user interface responds to user input.
  40. 40. standard input/output
  41. 41. test('htmlEncode', 1, function() {! ! ! var str = '<I love working with JS & CSS>';! ! ! ! equal(! ! ! ! MyApp.htmlEncode(str), ! ! ! ! '&lt;I love working with JS &amp; CSS&gt;'! ! ! );! });
  42. 42. the DOM
  43. 43. module('audioPlayer', {! ! ! setup: function(){! ! ! ! ! $('<a class="audio-play"></a>')! ! ! ! ! ! ! .appendTo(document.body);! ! ! },! ! ! teardown: function(){! ! ! ! ! document.body.innerHTML = ';! ! ! }!! ! );! ! test('button state', 2, function() {! ! ! var $elm = $('.audio-play'),! ! ! ! ! player = new MyApp.AudioPlayer($elm);! ! ! ! ! ! ok(!$elm.hasClass(‘audio-playing'));! ! ! ! $elm.trigger('click');! ! ! ok($elm.hasClass('audio-playing'));!! ! });
  44. 44. Pub/Sub
 (this is easy)
  45. 45. test('logout', 1, function() {! ! ! MyApp.subscribe('user:logout', function(){! ! ! ! ! ok(true);! ! ! });! ! ! ! MyApp.setup();! ! ! $('.logout').trigger('click');! });
  46. 46. Mocking api
  47. 47. test('windows matchmedia', 2, function() {! ! ! ! ! var spy = sinon.spy(window, 'matchMedia');! ! ! ! MyApp.getDeviceOrientation();! ! ! ! ok(spy.calledOnce);! ! ! ok(spy.calledWith('(orientation:portrait)');! ! ! ! spy.restore();! });
  48. 48. test('windows matchmedia', 3, function() {! ! ! var stub = sinon.stub(window, 'matchMedia');! ! ! ! window.matchMedia.returns({! ! ! ! ! matches: false! ! ! });! ! ! ! equal(MyApp.getDeviceOrientation(), 'landscape');! ! ! ok(window.matchMedia.calledOnce);! ! ! ok(window.matchMedia! ! ! ! ! .calledWith('(orientation:portrait)');! ! ! stub.restore();! });
  49. 49. AJAX
  50. 50. test('ajax call', 2, function() {! ! ! var ajaxStub = sinon.stub($, 'ajax');! ! ! ajaxStub.yieldsTo('success', { results: […] });! ! ! ! ! ! ! equal($('#news li').length, 5);! ! ! ! $('.load-more').trigger('click');! ! ! equal($('#news li').length, 10);! ! ! ! ajaxStub.restore();! });
  51. 51. Can’t mock? GET CREATIVE!
  52. 52. asyncTest('redirect', 1, function() {!! ! ! ! $('window').on('beforeunload', function(e){! ! ! ! ! e.preventDefault();! ! ! ! ! ok(true, 'redirect works');! ! ! ! ! start();! ! ! });! ! ! ! window.location.href = 'newLocation';! });
  53. 53. asyncTest('script onload', 2, function() {! ! ! ! ! var oldIB = HTMLElement.prototype.insertBefore,! ! ! ! ! scripts = [];! ! ! ! ! ! HTMLElement.prototype! ! ! ! ! .insertBefore = function(script){! ! ! ! ! ! ! scripts.push(script);! ! ! ! ! };! ! ! ! ! ! MyApp.loadScript('fake_url', function(){! ! ! ! ! ok(true);! ! ! });! ! ! ! ! var script = scripts[0];! ! ! equal(script.src, 'fake_url');! ! ! ! script.onload();! ! ! ! HTMLElement.prototype.insertBefore = oldIB;!! ! });
  54. 54. Selenium Hell Automatable !Automatable Feature Code Unit Acceptance Usability Code Review Linting Styleguide Integration Manual Testing http://beginner.worth1000.com/entries/79392/red-fire
  55. 55. Back to square one…
  56. 56. “…then you’re doing it wrong” http://www.brianorndorf.com/2010/07/reliving-the-summer-of-1990-week-eight.html
  57. 57. How to do it right?
  58. 58. Forget the framework 
 in the short-term
  59. 59. Don’t automate something just because you can
  60. 60. Can this be automated? Are there technical reasons why this can’t be automated, or practical reasons why automation isn’t the best candidate ! Does this need to be automated? What is the actual benefit in making this an automated test? How would it benefit the the chain of work? How would it benefit the team? Learn when to automate
  61. 61. Prioritise
 (business critical vs nice to have)
  62. 62. A learning process
  63. 63. Programming is magic
  64. 64. “Software development is a learning process, working code is a side effect” – Alberto Brandolini
  65. 65. Remember being a kid? https://parentsavvy.com/child-health/?SubtopicId=30014,30017&DocId=1,2954
  66. 66. “The greatest thing about being a scientist is you never have to grow up” – Neil deGrasseTyson
  67. 67. A scientific method is by definition, repeatable. 
 
 If an experimental result cannot be verified by repetition, it is not scientific.
  68. 68. Applying this method to programming is… http://en.wikipedia.org/wiki/Marie_Curie
  69. 69. http://en.wikipedia.org/wiki/Marie_Curie The Spirit of Testing marco@fromthefront.it http://cedmax.com @cedmax
  70. 70. http://en.wikipedia.org/wiki/Marie_Curie The Spirit of Testing marco@fromthefront.it http://cedmax.com @cedmax

×