Where to test first?

Preview:

DESCRIPTION

Don't start writing JavaScript code with unit tests! And let's find out why... :) #OdessaJS, Lightning talk at OdessaJS 2014 For English speakers: 8 — describe("puddle", ... contains water 9 — describe("puddle", ... it's a small hollow 10 — when jumping in 11 — it makes splashes 12 — feet can become wet 13 — the same phrases (just on 1 slide) GIFs and movies: 1) Code on manual QA: http://tinyurl.com/odessajs-puddle 2) Cat and Jenga: http://i.imgur.com/T6SbtaS.gif 3) Groundhog day - E2E: http://tinyurl.com/odessajs-groundhog 4) E2E bookmarklet video —http://vimeo.com/noomorph/odessajs-e2e-mocha-example

Citation preview

W H E R E T O T E S T F I R S T

YA R O S L AV S E R H I E I E V, F R O N T- E N D D E V E L O P E R

D O N ’ T S TA R T F R O M U N I T T E S T S *

* I N M O S T C A S E S@noomorph

TESTS

@noomorph

CODETESTS

@noomorph

CODETESTS

TESTS@noomorph

CODETESTS

TESTS CODE

U N I T T E S T S F O R P U D D L E

@noomorph

D E S C R I B E ( “ЛУЖА ” , СОСТОИТ ИЗ ВОДЫ

@noomorph

D E S C R I B E ( “ЛУЖА ” , ЭТО НЕБОЛЬШОЕ УГЛУБЛЕНИЕ

@noomorph

ПРИ ВСТУПАНИИ В НЕЕ

@noomorph

СОЗДАЕТ БРЫЗГИ

@noomorph

МОЖНО ПРОМОЧИТЬ НОГИ

@noomorph

PA S S I N G U N I T T E S T S

C O D E O N M A N U A L Q A

G A P B E T W E E N C O D E & P R O D U C T

C O O K T D D R I G H T: S TA R T F R O M “ B I G G E R ”

@noomorph

S TA R T F R O M “ B I R D V I E W ”

U N I T T E S T S A R E M O R E F R A G I L E

Requirements

Architecture

Classes

Unit Tests

@noomorph

E 2 E PA S S I N G = J E N G A S TA N D S

L E T E 2 E T O T E S T P U D D L E S

… B U T U N I T T E S T S A R E I M P O R TA N T T O O

… B U T U N I T T E S T S A R E I M P O R TA N T T O O

code with unit tests

… B U T U N I T T E S T S A R E I M P O R TA N T T O O

code without unit testscode with unit tests

E 2 E S TA R T S I N B R O W S E R C O N S O L E

@noomorph

J S T E S T S J S

M O C H A B O O K M A R K L E Thttps://github.com/noomorph/mocha-­‐bookmarklet

• loads  Mocha/Chai  scripts  • creates  output  container  for  the  results  • prompts  for  your  spec  URL  or  raw  code  to  paste  and  run

@noomorph

T H A N K S F O R AT T E N T I O N