Unit Testing in JavaScript Using Mocha & Chai

Slide 1

Slide 1 text

WITH MOCHA + CHAI UNIT TESTING Hill Country JavaScript Meetup July 20, 2016

Slide 2

Slide 2 text

UNIT TESTING WITH MOCHA + CHAI QUESTIONS WE’LL ANSWER TONIGHT: ▸ Who does unit testing? ▸ What is unit testing? ▸ When should I use unit testing? ▸ Why do developers use unit testing? ▸ How do I get started with unit testing? 2

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

ERIC CARRAWAY MY PROGRAMMING BACKGROUND ▸ High School Computer Science in 1995 ▸ Borland Turbo Pascal ▸ 12 Year Gap ▸ Music School, Teaching Career ▸ Music Visualizations (2007) ▸ Self Study + Coding Bootcamp (2014) 5 Contact: [email protected]

Slide 6

Slide 6 text

Slide 7

Slide 7 text

Slide 8

Slide 8 text

AN ANALOGY LEARNING TO CODE 8

Slide 9

Slide 9 text

LEARNING TO CODE THREE-LEGGED STOOL ▸ Tutorials, step-by-step books ▸ codecademy.com ▸ Algorithm Challenges ▸ codingbat.com ▸ coderbyte.com ▸ Projects ▸ Ideation, Creativity 9

Slide 10

Slide 10 text

Slide 11

Slide 11 text

CONFIDENCE TO REFACTOR TEST-DRIVEN APPROACH 11

Slide 12

Slide 12 text

WE WANT MAKE A PACKAGE OF GOAL KILOS OF CHOCOLATE. WE HAVE SMALL BARS (1 KILO EACH) AND BIG BARS (5 KILOS EACH). RETURN THE NUMBER OF SMALL BARS TO USE, ASSUMING WE ALWAYS USE BIG BARS BEFORE SMALL BARS. RETURN -1 IF IT CAN'T BE DONE. Nick Parlante, CodingBat.com A FAVORITE ALGORITHM CHALLENGE 12

Slide 13

Slide 13 text

BACK TO JAVASCRIPT… 13

Slide 14

Slide 14 text

HTTPS://GITHUB.COM/ERICCARRAWAY/CODINGBAT-JS14

Slide 15

Slide 15 text

HOW DOES THIS RELATE TO TESTING? 15

Slide 16

Slide 16 text

ALGORITHM CHALLENGES ARE GENERALLY PURE-FUNCTIONS PURE-FUNCTIONS ARE A GREAT INTRODUCTION TO UNIT TESTING ▸ Tests that are only concerned with input and output of a function ▸ Focus narrowly before worrying about ▸ Dependency injection ▸ Global state ▸ Asynchronous behavior ▸ Mocks ▸ Browser automation 16

Slide 17

Slide 17 text

LEARN TO CODE IN THE BROWSER CODINGBAT.COM - INSTANT FEEDBACK ▸ We want make a package of goal kilos of chocolate. ▸ We have small bars (1 kilo each) ▸ and big bars (5 kilos each) ▸ Return the number of small bars to use, assuming we always use big bars before small bars ▸ Return -1 if it can't be done. 17

Slide 18

Slide 18 text

Slide 19

Slide 19 text

LIVE DEMO PRAGMATISM OF Q-UNIT HTTP://PLNKR.CO/EDIT/JNKDLO?P=PREVIEW MOCHA + CHAI BUT FIRST, 19

Slide 20

Slide 20 text

Slide 21

Slide 21 text

UNIT TESTING IN JAVASCRIPT QUICK REVIEW - BEFORE MOCHA + CHAI ▸ Who / What / When / Why / How ▸ Three-Legged Stool Analogy ▸ Algorithm Challenges (Test-Driven Approach) ▸ _____________________________________________________ ▸ Mocha + Chai ▸ Rock, Paper, Scissors ▸ Rock, Paper, Scissors, Lizard, Spock ▸ https://github.com/ericcarraway/codingbat-js/tree/master/ rockPaperScissorsLizardSpock 21

Slide 22

Slide 22 text

PREVIEW 22

Slide 23

Slide 23 text

GETTING SET UP ▸ mkdir mocha-chai-demo ▸ cd mocha-chai-demo ▸ npm install mocha ▸ npm install chai 23

Slide 24

Slide 24 text

Slide 25

Slide 25 text

GETTING SET UP FOR MOCHA + CHAI CREATE FILES AND DIRECTORIES 25

Slide 26

Slide 26 text

GETTING SET UP OPTIONS FOR FILE NAMES, DIRECTORIES ▸ Mocha, by default, looks for a directory called “test” ▸ this allows you to simply run `mocha` ▸ Another approach: `.spec` right next to your module 26