BDD - Jasmine
Agenda
• Need of TDD/BDD
• Steps to BDD
• Familiarize terminology
• Installation
• Executing jasmine
• Write tests in jasm...
TDD
• Involves writing tests before writing the code
being tested
• Write a small test first (at this point of time no
cod...
TDD - Challenges
• As the code size increases more refactor
becomes critical
• Since most of the time the features are not...
So what next???
• In real time objects are the carriers
• They extend the behavior of classes
• This would be mean, “what ...
BDD
• Behaviour Driven Development is an Agile
development process that comprises aspects of
– Acceptance Test Driven Plan...
BDD
• BDD puts the focus on Behavior rather than
structure
• Examples
– User inputting values
– Awaiting for the feedback
...
BDD Triad
• For better communication across the levels
(Business analysts, Developers, Testers) in
software development we...
BDD Cycle
Jasmine
Jasmine
• It’s a BDD Framework for testing JavaScript
• Does not depend on other frameworks
• Does not require a DOM
• Cle...
Principles
• Should not be tied to any browser, framework,
platform or host language
• Should have idiomatic and unsurpris...
Goals
• It should encourage good testing practices
• It should be simple to get start with
• It should integrate easily wi...
Terminology
•Specs
•Suites
•describe
•it
•expect
•matchers
•mocks
•spies
Installation
•Required files/structure
•Download stand alone zip file include the lib files
<script type="text/javascript"...
Implementation/File structure
•jasmine-example/
• lib/
• jasmine-1.3.1/jasmine.js
• jasmine-1.3.1/jasmine-html.js
• jasmin...
http://tryjasmine.com/
describe ... it
describe accepts a
string or class.
Helps in
organizing specs
it is what describes the
spec. It optionally...
Filters
// Jasmine
var calc;
beforeEach(function(){
calc = new Calculator();
});
afterEach(function(){
calc.reset();
});
P...
Expectations
//Jasmine
it (“should return the sum”, function(){
calc = new Calculator();
expect(calc.Add(4,5).toEqual(9));...
http://tryjasmine.com/
Specs - variables
Spec -
describe('panda',function(){
it('is happy',function(){
expect(panda).toBe('happy');
});
});
JavaS...
Specs - variables
Spec -
describe('panda',function(){
it('is happy',function(){
expect(panda).toBe('happy');
});
});
JavaS...
Specs - functions
Spec
describe('Hello World function',function(){
it('just prints a string',function(){
expect(helloWorld...
Specs –matchers
Spec
describe('Hello World function',function(){
it('just prints a string',function(){
expect(helloWorld()...
Specs –Custom matchers
Spec
describe('Hello world', function() {
beforeEach(function() {
this.addMatchers({
toBeDivisibleB...
Spy
• Spy are handy in tracking down the usage of dependent or
functions that are being invoked by other functions
• Take ...
Spy - usage
• spyOn(obj, 'method')
• expect(obj.method).toHaveBeenCalled()
• expect(obj.method).toHaveBeenCalled(“Hello”,”...
Specs – Spy
describe("User", function() {
it("calls the salutation function", function() {
var visitor = new User();
spyOn...
Specs – Functions
User = function(){};
User.prototype.greetUser = function(salutation){
return this.sayHello() + "" + salu...
DEMO
What next?
• Spies
• Mocking/Faking
• coffee-script
• jasmine-jquery
• jasmine-fixture
• jasmine-stealth
Thanks
References:
http://blog.bandzarewicz.com/blog/2012/03/08/jasmine-cheat-sheet/
http://evanhahn.com/how-do-i-jasmine/...
Upcoming SlideShare
Loading in...5
×

Jasmine - A BDD test framework for JavaScript

1,347

Published on

Jasmine is the BDD implementation for JavaScript. With it's Behavior Driven approach developers are empowered with more testing capabiliites.

Although BDD is principally an idea about how software development should be managed by both business interests and technical insight, the practice of BDD does assume the use of specialized software tools to support the development process.

Published in: Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,347
On Slideshare
0
From Embeds
0
Number of Embeds
17
Actions
Shares
0
Downloads
10
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Jasmine - A BDD test framework for JavaScript

  1. 1. BDD - Jasmine
  2. 2. Agenda • Need of TDD/BDD • Steps to BDD • Familiarize terminology • Installation • Executing jasmine • Write tests in jasmine • What next?
  3. 3. TDD • Involves writing tests before writing the code being tested • Write a small test first (at this point of time no code being written!) • Run the test (obviously, it fails!) • Now make the test pass (well write some code) • Observe the design, refactor
  4. 4. TDD - Challenges • As the code size increases more refactor becomes critical • Since most of the time the features are not pre- determined reviewing/refactoring does prove as time consuming and becomes expensive
  5. 5. So what next??? • In real time objects are the carriers • They extend the behavior of classes • This would be mean, “what an object does is significantly more important!” • It’s all behavior
  6. 6. BDD • Behaviour Driven Development is an Agile development process that comprises aspects of – Acceptance Test Driven Planning, – Domain Driven Design – Test Driven Development
  7. 7. BDD • BDD puts the focus on Behavior rather than structure • Examples – User inputting values – Awaiting for the feedback – Calculations/logic • It’s all behavior
  8. 8. BDD Triad • For better communication across the levels (Business analysts, Developers, Testers) in software development we narrate/describe the logical chunks as scenarios • Given/When/Then – called as BDD triad
  9. 9. BDD Cycle
  10. 10. Jasmine
  11. 11. Jasmine • It’s a BDD Framework for testing JavaScript • Does not depend on other frameworks • Does not require a DOM • Clean & Obvious syntax • Influenced by Rspec, JSSpec, Jspec • Available as stand-alone, ruby gem, Node.js module, as Maven plugin
  12. 12. Principles • Should not be tied to any browser, framework, platform or host language • Should have idiomatic and unsurprising syntax • Should work wherever JavaScript runs • Should play well with IDE’s
  13. 13. Goals • It should encourage good testing practices • It should be simple to get start with • It should integrate easily with continuous build systems
  14. 14. Terminology •Specs •Suites •describe •it •expect •matchers •mocks •spies
  15. 15. Installation •Required files/structure •Download stand alone zip file include the lib files <script type="text/javascript" src="lib/jasmine-1.0.0.rc1/jasmine.js"></script>   <script type="text/javascript" src="lib/jasmine-1.0.0.rc1/jasmine-html.js"></script>   •Include styles as well <link rel="stylesheet" type="text/css" href="lib/jasmine-1.0.0.rc1/jasmine.css">
  16. 16. Implementation/File structure •jasmine-example/ • lib/ • jasmine-1.3.1/jasmine.js • jasmine-1.3.1/jasmine-html.js • jasmine-1.0.0.rc1/jasmine.css • specs/ • SpecHelper.js • BasicMathSpec.js • scripts/ • BasicMath.js
  17. 17. http://tryjasmine.com/
  18. 18. describe ... it describe accepts a string or class. Helps in organizing specs it is what describes the spec. It optionally takes a string // Jasmine describe “Calculate”, function() { describe “#Add”, function(){ it “should give sum”, function(){ ----- ----- }; }); });
  19. 19. Filters // Jasmine var calc; beforeEach(function(){ calc = new Calculator(); }); afterEach(function(){ calc.reset(); }); Pretty handy to create data for each test before runs the specified block before each test. after runs the specified block after each test.
  20. 20. Expectations //Jasmine it (“should return the sum”, function(){ calc = new Calculator(); expect(calc.Add(4,5).toEqual(9)); expect(calc.Add(4,4).not.toEqual(9)); });
  21. 21. http://tryjasmine.com/
  22. 22. Specs - variables Spec - describe('panda',function(){ it('is happy',function(){ expect(panda).toBe('happy'); }); }); JavaScript panda = “happy”;
  23. 23. Specs - variables Spec - describe('panda',function(){ it('is happy',function(){ expect(panda).toBe('happy'); }); }); JavaScript panda = “happy”;
  24. 24. Specs - functions Spec describe('Hello World function',function(){ it('just prints a string',function(){ expect(helloWorld()).toEqual("Hello world!"); }); }); JavaScript function helloWorld(){ return "Hello world!"; }
  25. 25. Specs –matchers Spec describe('Hello World function',function(){ it('just prints a string',function(){ expect(helloWorld()).toContain("world!"); }); }); JavaScript function helloWorld(){ return "Hello world!"; }
  26. 26. Specs –Custom matchers Spec describe('Hello world', function() { beforeEach(function() { this.addMatchers({ toBeDivisibleByTwo: function() { return (this.actual % 2) === 0; } }); }); it('is divisible by 2', function() { expect(guessANumber()).toBeDivisibleByTwo(); }); });
  27. 27. Spy • Spy are handy in tracking down the usage of dependent or functions that are being invoked by other functions • Take a scenario, where on the website I would like to wish the user like Hi, Hello along with salutation Mr, Ms, Mrs • Say I have a simple function greet() which returns plain string • Another function which returns the salutation() • spyOn(obj, 'method') • expect(obj.method).toHaveBeenCalled()
  28. 28. Spy - usage • spyOn(obj, 'method') • expect(obj.method).toHaveBeenCalled() • expect(obj.method).toHaveBeenCalled(“Hello”,”Mr”) • obj.method.callCount
  29. 29. Specs – Spy describe("User", function() { it("calls the salutation function", function() { var visitor = new User(); spyOn(visitor, "greetUser"); visitor.greetUser("Hello"); expect(visitor.greetUser).toHaveBeenCalled(); }); });
  30. 30. Specs – Functions User = function(){}; User.prototype.greetUser = function(salutation){ return this.sayHello() + "" + salutation; } User.prototype.sayHello = function(){ return "Hello"; }
  31. 31. DEMO
  32. 32. What next? • Spies • Mocking/Faking • coffee-script • jasmine-jquery • jasmine-fixture • jasmine-stealth
  33. 33. Thanks References: http://blog.bandzarewicz.com/blog/2012/03/08/jasmine-cheat-sheet/ http://evanhahn.com/how-do-i-jasmine/ http://tobyho.com/2011/12/15/jasmine-spy-cheatsheet/ https://github.com/pivotal/jasmine/wiki/Spies
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×