Test-Driven Development with TypeScript+Jasmine

+AngularJS

1

#smartorgdevSomik Raha Kai Wu

Github repo: https://github.com/behappyrightnow/anagram

Thilak Selvan

2

A Brief History of Software Engineering

ENIAC, 1946-55

3

Programs were input with Punched Cards

Human labor was cheap. Computer time was expensive. More value in getting program right the first time.

4

IBM 360 Mainframes

Time-sharing computers

Late 1960s

Waterfall is a result of human confusion

5

“Managing the Development of Large Software Systems”, Dr. Winston W. Royce (Link) - 1970

6

For some mysterious reason, people latched on to Fig 2, and thought it looked like a

waterfall.

The name caught up and ushered in “phased” mindset of development.

7

But Dr. Royce had a Fig. 3

8

And a Fig. 4! As far back as 1970, Royce was describing the

beginnings of an agile mindset, but the Waterfall

religion had already started, based on a misunderstanding!

Meanwhile, a community of philosophers in software engineering started forming in the

90’s

9

Ward Cunningham

Founding of the WikiWikiWeb in 1994.

Ward’s wiki became the home for conversations on Design Patterns.

10

1995, caused a revolution in Object-Oriented thinking

Book knows as the “Gang of Four”

The false religion of Waterfall was then seriously challenged in 2000

11

12

Source: agileatlas.org

Barry Boehm’s Cost of Change Curve

We were initially justified in doing high-quality design when computer time was more expensive than programmer time

13

Aspirational Cost of Change curve

But now, programmer time is much more expensive, and we would love to flatten the curve

time

cost

of c

hang

e

This is what Extreme Programming was inviting us to consider

The XP Practices

14

The “Planning Game” had strong influences from Scrum

What’s the difference?

Test-Driven Development

versus

Unit Testing

15

XP’s success led to a broader umbrella under a more neutral-sounding “Agile Software

Development”

16

Core practices like TDD and Refactoring are no longer controversial - they are a part of a programmer’s foundation.

Martin Fowler’s book is now a classic.

Most conventional IDEs support automated refactoring.

17

Erich Gamma

One of the Gang of Four, authored JUnit with Kent Beck, while on a long flight together,

1997

Great Article by Alberto Savoia: Beautiful Tests History of xUnit by Martin Fowler

“JUnit took off like a rocket - and was essential to supporting the growing movement of Extreme Programming and Test Driven Development. I've seen a huge change of attitude

towards testing in the last decade, and I think JUnit played a big role in that. By being small and simple it encouraged

people to learn and use it. It also proved amenable to others extending it integrating it into tools.” — Martin Fowler

Lots of JUnit ports, generally referred to as xUnit

18

nUnit - C# cppUnit - C++ pyunit- Python

Functional Programming/Behavior-Driven Development

19

Jasmine: TDD with JS from Pivotal Labs

Lettuce: DSL for testing and beyond by Gabriel Falcao

Continuous Build Servers

20

21

Let’s experience some TDD now

22

23

Anagram Unjumbler

leppazizap

couisldei

Unjumble this

We will use TypeScript

24

Anders Hejlsberg Creator of C# and

TypeScript

Superset of Javascript Supports class-based OO concepts

Takes the tedium out of JS

Keeps you in JS paradigm (as opposed to coffee script)

We will use Testem

25

Continuously runs our unit tests

Step 1. git clone https://github.com/behappyrightnow/anagram.git Step 2. cd anagram Step 3. git checkout step1 Step 4. Install NodeJS from http://nodejs.org/ Step 5. npm install testem

Let’s start with checking out a basic stub from Github

26

Let’s start by writing tests

27

Come up with 5 English words, jumble them up Find all other words you can create with those letters

List your tests.

e.g.INPUT OUTPUTleppa applerodo door, odor

Challenge for you

28

Make the following game using existing codebase to help game show hosts construct a puzzle.

Given an input word, create clues by adding one extra letter.

INPUT OUTPUTrose horse without “h”

sores without “s”

Game show host can now use this program to construct their show saying:

Can you find flowers using this clue…

Your web-interface should provide this:

PASS 1: Write the code without any tests PASS 2: Keep your code aside, write tests first and then write code

Reflection: Write an essay on what you learned by comparing Pass 1 and Pass 2, and in general what you learned from this session

Crack this challenge in the following way:

29