Embed Size (px)
DESCRIPTION
Slides from the talk I gave at meet.js summit in Poznań, on January 14th 2012: http://summit.meetjs.pl/
Citation preview
Practical guide to unit testing
Krzysztof Szafranek meet.js summit 2012
1
[ˈ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.
a function created to test other function
unit testin practice™
3
This is what it comes down to in JavaScript.
unit testing?
4
Unit testing is very much like regular exercise:everybody knows it’s good, but few people do it.
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.
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.
tests increase confidence
6
It’s easier to change code knowing that tests will show places affected by the change.
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.
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.
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.
“We don’t have time for that!”
the
argument10
The most common excuse for not writing tests.
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.
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.
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.
“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.
the how
13
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.
tools
15
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
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
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.
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.
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.
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.
demo time!
21
Demonstration of buster.js with a simple test run in two desktop browsers and iOS simulator.
1. test2. minimum code
that works3. refactor4. repeat
22
Practical guide to unit testing
23
Thing’s I learned about JS unit testing myself.
in practic
e
test what matters
24
Don’t test getters and setters, but methods that actually do something
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.
in practic
e
keep your testsfast
26
- What is “fast”...?- 1 second is fast.
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.
in practic
e
automate
28
Early error detection for free.Use continuous integration software (Jenkins, Hudson, Cruise Control...).
in practic
e
expect tests
29
Tests should be part of your definition of done. A feature without tests can’t be considered complete.
I challenge you!
30
Start writing tests the next time you write code after watching this presentation!
pragdave
varun suresh
rwoan
photo credits:
cyberpenguin
edtechie99
35
