practical guide to unit testing
Post on 18-Oct-2014
3.523 views
DESCRIPTION
Slides from the talk I gave at meet.js summit in Poznań, on January 14th 2012: http://summit.meetjs.pl/TRANSCRIPT
![Page 1: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/1.jpg)
Practical guide to unit testing
Krzysztof Szafranek meet.js summit 2012
1
![Page 2: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/2.jpg)
[ˈkʂɨʂtɔf ʂafranˈɛk]
Roche
Nokia
wooga game developer
front-end architect
front-end unit leader
2
Everything front-end.Currently HTML5 game developer @ wooga.
![Page 3: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/3.jpg)
a function created to test other function
unit testin practice™
3
This is what it comes down to in JavaScript.
![Page 4: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/4.jpg)
unit testing?
4
Unit testing is very much like regular exercise:everybody knows it’s good, but few people do it.
![Page 5: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/5.jpg)
47%
45%
5%3%
I don’t know what are unit tests My code doesn’t
need tests
I don’t write tests, but I would like to
I write tests
5
The results of the poll I ran on my blog.I got 60 responses.
![Page 6: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/6.jpg)
47%
45%
5%3%
I don’t know what are unit tests My code doesn’t
need tests
I don’t write tests, but I would like to
I write tests
5
The results of the poll I ran on my blog.I got 60 responses.
![Page 7: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/7.jpg)
tests increase confidence
6
It’s easier to change code knowing that tests will show places affected by the change.
![Page 8: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/8.jpg)
tests encourage good design
7
Tests force your methods to be short, simple and with very few dependencies. You end up in the code that’s not only less buggy, but also more readable.
![Page 9: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/9.jpg)
collective ownership
8
No, it’s not communism. It means that the code is guarded from harm by tests. Team members can confidently modify the code they didn’t write, as long as they ensure that test still pass.
![Page 10: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/10.jpg)
one click to test them all
9
With test runner all your tests can be run automatically at the same time in as many browsers you want.
![Page 11: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/11.jpg)
“We don’t have time for that!”
the
argument10
The most common excuse for not writing tests.
![Page 12: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/12.jpg)
cum
ula
tive
fun
ctio
na
lity
time
good design
no design
design payoff line
11
The graph comes from Martin Fowler’s article: http://martinfowler.com/bliki/DesignStaminaHypothesis.htmlIt applies very much to unit testing.
![Page 13: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/13.jpg)
cum
ula
tive
fun
ctio
na
lity
time
good design
no design
design payoff line
11
The graph comes from Martin Fowler’s article: http://martinfowler.com/bliki/DesignStaminaHypothesis.htmlIt applies very much to unit testing.
![Page 14: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/14.jpg)
cum
ula
tive
fun
ctio
na
lity
time
good design
no design
design payoff line
11
The graph comes from Martin Fowler’s article: http://martinfowler.com/bliki/DesignStaminaHypothesis.htmlIt applies very much to unit testing.
![Page 15: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/15.jpg)
“it's much lower than
most people think: usually
weeks not months.”
Martin Fowler
12
From my own experience, if you work on the project for longer than one man-month, the tests are starting to pay off for themselves in better quality and less time spent on finding and fixing bugs.
![Page 16: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/16.jpg)
the how
13
![Page 17: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/17.jpg)
1. test2. minimum code
that works3. refactor4. repeat
TDD
14
This behavior is Test Driven Development. Some people prefer writing implementation before tests. That can work too.
![Page 18: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/18.jpg)
tools
15
![Page 19: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/19.jpg)
buster.jstest framework
+test runner
16
New, but already powerful framework by Christian Johansen:- extensible API with optional BDD syntax- easy mocking, also for server connections- easy to automate- node and browser tests
![Page 20: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/20.jpg)
buster.jsnode.js!
test framework+
test runner16
New, but already powerful framework by Christian Johansen:- extensible API with optional BDD syntax- easy mocking, also for server connections- easy to automate- node and browser tests
![Page 21: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/21.jpg)
sources client server
config
browsers
17
The diagram is based on: http://code.google.com/p/js-test-driver/Buster implements most of the features of js-test-driver, and more.
![Page 22: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/22.jpg)
function async() { window.globalVar = false; setTimeout(function() { window.globalVar = true; }, 100);}
buster.testCase("asynchronous tests", { "test async changes global variable": function() { var clock = this.useFakeTimers(); async(); clock.tick(200); buster.assert.equals(window.globalVar, true); clock.restore(); }});
18
One of my favourite buster features: making asynchronous code with setTimeout running instantly. It keeps your tests fast.
![Page 23: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/23.jpg)
J3Unit
jsUnity
Vows
JSUnitQUnit
Crosscheck
screw-unit
JasmineTest.Simple
Test.MoreTestCaseTestIt
jsUnitTest
JSTest
JSTest.NET
Tyrtle
Nodeunit
RhinoUnit
JasUnit
FireUnit js-test-driverSinon.js
SOAtest
DOH
JSSpec
YUITest
JSNUnit
UnitTesting
JSpec
19
There are many JavaScript unit testing frameworks and the above list (from http://en.wikipedia.org/wiki/List_of_unit_testing_frameworks#JavaScript) is already incomplete.
![Page 24: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/24.jpg)
tools are secondary
20
If you find a different framework that fits your needs, that’s fine. Actually writing tests is more important than a choice of a particular framework.
![Page 25: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/25.jpg)
demo time!
21
Demonstration of buster.js with a simple test run in two desktop browsers and iOS simulator.
![Page 26: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/26.jpg)
1. test2. minimum code
that works3. refactor4. repeat
22
![Page 27: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/27.jpg)
Practical guide to unit testing
23
Thing’s I learned about JS unit testing myself.
![Page 28: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/28.jpg)
in practic
e
test what matters
24
Don’t test getters and setters, but methods that actually do something
![Page 29: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/29.jpg)
in practic
e
testyour own
system25
Don’t test browsers, network connections and other external systems. If your unit tests are sending requests over network, you’re doing something wrong.
![Page 30: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/30.jpg)
in practic
e
keep your testsfast
26
- What is “fast”...?- 1 second is fast.
![Page 31: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/31.jpg)
in practic
e
write testsas you go
27
I don’t belive in large retrospective refactorings.If you have a lot of untested code:- Write test BEFORE when you have to fix a bug. It will ensure the bug will not re-appear in the future.- Write tests for all new code.- Don’t refactor without writing tests first. Otherwise it’s running around with scissors, not refactoring.
![Page 32: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/32.jpg)
in practic
e
automate
28
Early error detection for free.Use continuous integration software (Jenkins, Hudson, Cruise Control...).
![Page 33: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/33.jpg)
in practic
e
expect tests
29
Tests should be part of your definition of done. A feature without tests can’t be considered complete.
![Page 34: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/34.jpg)
I challenge you!
30
Start writing tests the next time you write code after watching this presentation!
![Page 39: Practical Guide to Unit Testing](https://reader033.vdocument.in/reader033/viewer/2022051411/5443403fafaf9ff7098b4888/html5/thumbnails/39.jpg)
pragdave
varun suresh
rwoan
photo credits:
cyberpenguin
edtechie99
35