practical guide to unit testing

Post on 18-Oct-2014

3.524 Views

Category:

Technology

2 Downloads

Preview:

Click to see full reader

DESCRIPTION

Slides from the talk I gave at meet.js summit in Poznań, on January 14th 2012: http://summit.meetjs.pl/

TRANSCRIPT

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!

krzysztof@szafranek.net

(name)

Thank you!

31

krzysztof@szafranek.net

Thank you!

(contact email)

32

krzysztof@szafranek.net

(twitter)

Thank you!

33

krzysztof@szafranek.net

(website)

Thank you!

34

top related