Slide 1

Slide 1 text

Behavior Driven Development

Slide 2

Slide 2 text

Who we are? Software Craftsman at Coach at Premier Field Engineer at Trainer Co-organizer TDD and BDD paranoiac! TypeScript fanboy!

Slide 3

Slide 3 text

Let's talk about BDD with…

Slide 4

Slide 4 text

What is BDD? This is an enhancement of TDD introduced by Dan North in 2003 when he was a TDD trainer. The aim of BDD is to re-explain the basics of TDD replacing the word Test with Behavior. Dan North defines it as: "TDD done well".

Slide 5

Slide 5 text

Common mistakes… Too much people think that TDD is about unit testing while all is about acceptance testing Too much people think that BDD is about UI testing while all is about acceptance testing

Slide 6

Slide 6 text

BDD vs UI tests We are not talking about the same thing here. BDD is a way to drive your development by focusing on the system behavior. UI tests is about executing tests on the UI layer.

Slide 7

Slide 7 text

BDD == TDD Yes and No… For programmers BDD is just TDD. BDD brings something more than TDD: communication. Help all the project team to work together.

Slide 8

Slide 8 text

Think about that… As a user In order to validate my cart I need to be authenticated if(this.user.isAuthenticated) { this.cart.validate(); }

Slide 9

Slide 9 text

The Gherkin language Gherkin helps you to describe software’s behaviors. This "documentation" help to test automatically your code. Let’s see an example..

Slide 10

Slide 10 text

Gherkin: The bad way Scenario: Search with a browser Given I open a web browser And I navigate to https://google.fr When I fill the search input "TypeScript" And I click on the search button Then I am redirected on the results page And I should see links related to "TypeScript"

Slide 11

Slide 11 text

Why is it so bad? It describes how to search on Google with a browser. If you want to do the same with a mobile assistant, you have to write another scenario. But behavior is the same…

Slide 12

Slide 12 text

Gherkin: The bad way (2) Scenario: Search with Google assistant Given I’m on my smartphone And I say "Ok Google" When I say "Search for TypeScript on the web" Then I am redirected on the results page And I should see links related to "TypeScript"

Slide 13

Slide 13 text

Gherkin: The good way Scenario: Search for TypeScript on Google When I search for "TypeScript" on Google Then I should get results related to "TypeScript"

Slide 14

Slide 14 text

Why is it better? It describes how to search on Google and that’s all. It can be used to execute tests on each platform you want. It's just a single scenario -> easier to maintain.

Slide 15

Slide 15 text

Let's take a look at Cucumber A Behavior Driven Development framework. First built in Ruby and now available for many languages. Gherkin parser and execution. Version 4

Slide 16

Slide 16 text

Features Gherkin features and scenarios. Scenario: Search without a value When I search without any value Then I have an error

Slide 17

Slide 17 text

Steps Given, When, Then as functions. import { expect } from "chai"; import { Then } from "cucumber"; Then("I have an error", function() { const expected = 400; expect(this.actual).to.be.equal(expected); });

Slide 18

Slide 18 text

World Scenario execution context. import { World, setWorldConstructor } from "cucumber"; declare module "cucumber" { interface World { actual: number | undefined; } } setWorldConstructor({ actual: undefined });

Slide 19

Slide 19 text

Hooks Run code during lifecycle import { Before, CallbackStepDefinition, HookScenarioResult } from "cucumber"; import { Database } from "sqlite3"; Before(function(scenario: HookScenarioResult, done: CallbackStepDefinition) { this.database.run( "CREATE TABLE Website (url TEXT, title TEXT, description TEXT)", err => { done(); } ); });

Slide 20

Slide 20 text

A real world example? "Guys, you can't implement a complete stack with BDD during a meetup, you need to built a project!"

Slide 21

Slide 21 text

An example with IoC? Let's go! ☺ Controller Container SQLite Provider Dependency Dependency Dependency Dependency Dependency Dependency

Slide 22

Slide 22 text

An example with IoC? Let's go! ☺ Controller Container SQLite Provider SQLite In Memory Dependency Dependency Dependency Dependency Dependency Dependency

Slide 23

Slide 23 text

Demo

Slide 24

Slide 24 text

Repo & Posts Samples: https://github.com/spontoreau/express-typescript-cucumber TypeScript & Cucumber – Getting started: https://sylvain.pontoreau.com/2018/04/30/typescript-cucumber-getting-started/

Slide 25

Slide 25 text

Question?

Slide 26

Slide 26 text

Thanks ☺