1. Applying BDD and TDD
practices, using Jasmine.js
- Anil Tarte
© Equal Experts UK Ltd 2011 www.equalexperts.com 1

2. Outline
 Development Environment
 What is TDD?
 What is BDD?
 Domain problem
 Stories
 Demonstration
 Questions?
© Equal Experts UK Ltd 2011 www.equalexperts.com 2

3. Development Environment
 Eclipse
– Using Eclipse IDE for JavaScript Web
Developers
– Installed Jetty(Run-Jetty-Run) plugin.
• Help -> Eclipse Marketplace -> type Jetty -> hit enter ->
install Run-Jetty-Run
 Backend Server(Streamer.jar),
– URL to access it “ws://localhost:8081/”
– It is a Streaming Engine and a Stub
Exchange
© Equal Experts UK Ltd 2011 www.equalexperts.com 3

4. Test Driven Development (TDD)?
 Concept
– Add a test for each new feature/improvement
– Write production code, to pass test
– Refactor
 Aspect
– KISS (Keep It Simple, Stupid)
– YAGNI (You Ain’t Goona Need It)
– Fake it till you make it
 Benefits
– Designs become more cleaner and clearer
– Testable code
– Focus only on what is important
© Equal Experts UK Ltd 2011 www.equalexperts.com 4

5. Behaviour Driven Development (BDD)?
 Concept
– Write/Automate a desired behaviour first (in natural
language)
– Driven by business value
 Aspect
– Test method names should be sentence
– It extends TDD
 Benefits
– Clear understanding of desired software behaviour
– Starting point
– Encourages more collaboration, Dev + QA + BA +
Customer
© Equal Experts UK Ltd 2011 www.equalexperts.com 5

6. Domain Problem
Heat Map
© Equal Experts UK Ltd 2011 www.equalexperts.com 6

7. Top 4 gainer?
© Equal Experts UK Ltd 2011 www.equalexperts.com 7

8. Different representation - Heat Map
© Equal Experts UK Ltd 2011 www.equalexperts.com 8

9. Another version
© Equal Experts UK Ltd 2011 www.equalexperts.com 9

10. Stories – Identify?
 Story 1 – As a trader, when I load application,
I want to see the instruments, so that …
 Story 2 – As a trader, I want to see “price
change” updating in real time, so that …
 Story 3 – As a trader, I should able to see
instruments performance visually(color
coded), so that I will get overview of the market in
real time
© Equal Experts UK Ltd 2011 www.equalexperts.com 10

11. Story 1
 As a trader, when I load application, I want to
see the instruments, so that …
 Scenario 1
– When a trader starts the application
– Then I will see the instruments with details
• Instrument Symbol
• Instrument Name
• Price change in percentage
© Equal Experts UK Ltd 2011 www.equalexperts.com 11

12. Design Discussion – Story 1
Connect to – ws://localhost:8081/
Knockout
bindings
Application Streamer
Engine
HTML document
© Equal Experts UK Ltd 2011 www.equalexperts.com 12

13. Design Discussion – Story 1
Connect to – ws://localhost:8081/
Application /Instrument
Streamer
Channel Engine
Instrument
Container
{
messageType:"Snapshot",
Knockout message : {[
bindings {
"instrumentSymbol":"PL Z11",
"instrumentName":"Platinum",
"instrumentChange":"-3.9“
}
]}
HTML document }
© Equal Experts UK Ltd 2011 www.equalexperts.com 13

14. Story 2
 As a trader, I want to see “price change”
updating in real time.
 Scenario 1
– Given I have launched Heat Map application
– When I monitor the Heat Map
– Then I will see the instrument’s “price change”
updates in real time
© Equal Experts UK Ltd 2011 www.equalexperts.com 14

15. Design Discussion – Story 2
Connect to – ws://localhost:8081/
Application /Instrument
Streamer
Channel Engine
Instrument
Instrument Container
{
Knockout messageType:“Update",
bindings message : {[
{
"instrumentName":"Platinum",
"instrumentChange":"-3.9“
}
]}
HTML documents
}
© Equal Experts UK Ltd 2011 www.equalexperts.com 15

16. Story 3
 As a trader, I should able to see instrument’s
performance visually.
 Scenario 1
– Given I have launched Heat Map application
– When I monitor the Heat Map
– Then I will see the instrument’s tile color changing
according to the “price change” in real time
© Equal Experts UK Ltd 2011 www.equalexperts.com 16

17. Design Discussion – Story 3
Connect to – ws://localhost:8081/
Color Code /Instrument
Application
Calculator
Streamer
Channel Engine
Instrument
Instrument Container
Knockout
bindings
HTML documents
© Equal Experts UK Ltd 2011 www.equalexperts.com 17

18. Questions?
© Equal Experts UK Ltd 2011 www.equalexperts.com 18