Test Driven Development

Cycle

  • Add a test
  • Run all tests and see if the new one fails
  • Write some code
  • Run tests
  • Refactor code

Repeat

Why

  • Immediate feedback (bugs are found earlier)
  • Make sure you don't break previous code
  • Help refactor code (don't have to worry too much) ex. better policy

Why Not

(from Stackoverflow)

  • Big time investment
  • Additional Complexity
  • Design isn't clear at first

Practice

Create a folder and add following files:

  • index.html

      <!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <title>TDD Practice</title>
      <link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-1.20.0.css">
  </head>
  <body>
      <div id="qunit"></div>
      <div id="qunit-fixture"></div>
      <script src="http://code.jquery.com/qunit/qunit-1.20.0.js"></script>
      <script src="main.js"></script>
      <script src="tests.js"></script>
  </body>
  </html>

  • tests.js

      QUnit.test("hello test", function( assert ) {
      assert.ok( 1 == "1", "Passed!" );
  });

  QUnit.test('max', function (assert) {

  });

  QUnit.test('isOdd', function (assert) {

  });

Then, let's start to edit main.js! Our goal is to write unit tests first and implement main.js to pass all the tests.

Reference