This document provides an overview of test-driven development (TDD) practices and tools for JavaScript developers. It discusses what TDD is, how to get started with TDD, and popular JavaScript testing frameworks like Mocha and Chai. It also covers tools for tasks, package management, continuous integration, code analysis, stubs, spies, and documentation for TDD in JavaScript.

1. TDD for
JavaScript
developers

2. What is TDD?
●
●
●
●
●
TODO list (navigation map)
Test first
Assert first
Fail first
Continuous integration

3. Red > Green > Refactor

4. What about TDD?
●
●
●
●
●
●
●
Unit tests coverage
Increases assurance of correctness
More complete explorations of requirements
Improved code
Code as documentation
Safe refactoring
No extra code

6. Pair programming

7. Baby steps

8. Emergency design

11. Broken Window Theory

12. Build Breakers

13. How to start with TDD?
●
●
●
●
●
●
●
Trainings
Management support
Skills sharing
Perseverance
Mentors
Metrics
Coding dojo

14. How to start with TDD?
● Start new project with TDD/BDD practice
● Start new task with unit tests
● Start to fix bugs with unit tests

15. Where is my test?
● Developers
● CI
● Deployment

16. Behavior-driven Development
● Given ...
● When ...
● Then ...
● describe ...
● it ...

17. JavaScript programming

18. Tools for JavaScript
Runners:
●
●
●
●
jsTestDriver
PhantomJS
Node.js
Browser

19. Tasks for JavaScript
● gruntjs
● grunt plugins

20. Tasks for JavaScript
● gulp.js

21. Bootstrap project
● Yeoman
● Brunch.io

22. Package managers
● npmjs
● bower.io
● volojs

23. Tools for JavaScript
IDE:
●
●
●
●
●
WebStorm
Netbeans
Eclipse
Sublime Text
c9.io

24. Tools for JavaScript
Continuous integration:
●
●
●
●
Jenkins/Hudson
TeamCity
Cruise Control
Travis-ci

25. Tools for JavaScript
Code analyze:
●
●
●
●
jslint
jshint
JSCoverage
jscpd

26. Tests
●
●
●
●
●
●
●
mocha
chai
buster.js
nodeunit
qunit
jasmine
sinon.js

27. Tests
cucumber.js

28. Mocha - getting started
<div id="mocha"></div>
... include js ...
<script src="mocha.js"></script>
<script>mocha.setup('bdd')</script>
... include tests ...
<script>
mocha.checkLeaks();
mocha.globals(['jQuery']);
mocha.run();
</script>

29. Mocha - suites and cases
describe("Test Suite", function() {
it("test case/spec", function() {
//BDD style
});
});
suite('Test Suite', function(){
test('test case', function(){
//TDD style
});
});

30. Mocha - setUp and tearDown
beforeEach(function() {
//code here call every time at start of test
});
afterEach(function() {
//code here call every time at after test
});

31. Mocha - docs
http://visionmedia.github.io/mocha/

32. Chai - assert
var assert = require('chai').assert
, foo = 'bar'
, beverages = { tea: [ 'chai', 'matcha', 'oolong' ] };
assert.typeOf(foo, 'string', 'foo is a string');
assert.equal(foo, 'bar', 'foo equal `bar`');
assert.notEqual(foo, 'barz', 'foo not equal `barz`');
assert.lengthOf(foo, 3, 'foo`s value has a length of 3');
assert.lengthOf(beverages.tea, 3, 'beverages has 3 types
of tea');

33. Chai - expect
var expect = require('chai').expect
, foo = 'bar'
, beverages = { tea: [ 'chai', 'matcha', 'oolong' ] };
expect(foo).to.be.a('string');
expect(foo).to.equal('bar');
expect(foo).to.not.equal('barz');
expect(foo).to.have.length(3);
expect(beverages).to.have.property('tea').with.length(3);

34. Chai - should
var should = require('chai').should() //actually call the the
function
, foo = 'bar'
, beverages = { tea: [ 'chai', 'matcha', 'oolong' ] };
foo.should.be.a('string');
foo.should.equal('bar');
foo.should.not.equal('barz');
foo.should.have.length(3);
beverages.should.have.property('tea').with.length(3);

35. Chai - docs
http://chaijs.com/api/

36. Sinon.js - spy, stub
"test should call subscribers on publish": function () {
var callback = sinon.spy();
PubSub.subscribe("message", callback);
PubSub.publishSync("message");
assertTrue(callback.called);
}

37. Sinon.js - env
var env, $ajax;
beforeEach(function() {
env = sinon.sandbox.create();
//stub all requests to server
$ajax = env.stub($, 'ajax');
});
afterEach(function() {
env.restore();
});

38. Sinon.js - env
http://sinonjs.
org/docs/

39. Links & books
http://visionmedia.github.io/mocha/
http://chaijs.com/
http://sinonjs.org/
http://www.testdrivenjs.com/
http://tddjs.com/

40. Questions?

41. Lets write code!