Unit testing with

TDD and BDD

What is a unit test?

  • A small "testable" part of the application
    • Method
    • Class
    • Interface
    • Component
    • Module
  • Definition of the internals
  • Keeper of the design contract (specs)

What is its purpose?

  • Isolation of code
  • Notifier of failing code
  • Useful for refactoring
  • Important for handing over software
  • New project members get quick insights
  • Programmer's sanity
  • Does/should not test dependencies (INTG)

TDD (Test Driven Development)

Test-driven development (TDD) is a software development process that relies on the repetition of a very short development cycle: requirements are turned into very specific test cases, then the software is improved to pass the new tests, only. This is opposed to software development that allows software to be added that is not proven to meet requirements.

Why use it?

  • Efficiency
    • short dev cycles
    • only write necessary code
  • Bug prevention
    • instead of bug detection
    • during refactoring
  • Better understanding of code/project
  • Best principles vs best practices
    • visionary (long term)

BDD (Behaviour Driven Development)

  • What is it?
  • Why should I use it?
  • What is the alternative?

Main focus is:

  • Where to start in the process
  • What to test and what not to test
  • How much to test in one go
  • What to call the tests
  • How to understand why a test fails

Why use it?

Unit test, TDD and BDD

  • Unit tests: WHAT?
  • TDD: WHEN?
  • BDD: HOW?
  • Can be used individually
  • Ideally should be used together

Automated testing suites

  • Jest
  • Mocha
  • Jasmine

Jest

  • Easy, close to no configuration test suite
  • Very good with React
  • Snapshots

Mocha

  • Needs assertion library
  • Chance it needs to be extended with other libraries
  • Sharper learning curve compared to Jest

Jasmine

  • Complete suite
  • One of the first
  • Quite a lot more complicated than Jest

Interactive Workshop

  • Goals
    • Create unit tests
    • Understand why we unit test
    • Benefits of tests during refactoring
    • Separate business logic from presentation

Interactive workshop

  • Steps
    • Test first, code later
    • Write code
    • Refactor
    • Create component
      • Separate logic & presentation
    • Create wrapper component

Install

  • npx create-react-app tdd
  • cd tdd
  • npm install --save prop-types
  • npm install --save-dev react-test-renderer
  • npm start
  • File naming conventions
    • .spec
    • .test
    • __test__

Let's go crazy!

  • Look at App.test.js
  • Delete App.test.js
  • Remove all logic inside App.js
  • Let's create our own

La Calculadora

The Calculator

What does it need to do?

Component

  • Simple calculations
    • +, -, x, ÷
  • Show result
  • Reset input and result

What does it need to do?

Simple calculations

  • +, -, x and ÷
    • ​compute valid values
      • ​numbers
      • strings
    • throw error with invalid input
  • ÷
    • Check for division by zero

TDD and Unit Tests

By CodePamoja

Made with Slides.com

TDD and Unit Tests

  • 19

More from CodePamoja