TDD, unit testing and java script testing frameworks workshop

Boutique product development companyIt is amazing what you can accomplish when you have a client-centric team to deliver outstanding products.

Boutique product development companyIt is amazing what you can accomplish when you have a client-centric team to deliver outstanding products.

Unit Testing, Test Driven Development and JavaScript Testing Frameworks

Sikandar Ahmed | Lead Software Engineer

Ahmad Awais | Software Engineer

Unit Testing increases the code quality

Unit Testing, TDD andJavaScript Testing Frameworks

Testing Types

Overview of Unit Testing

Best Practices

Some Difficult Scenarios

Levels of TDD

Test Driven Development

TDD and Agile

Extreme Programming

Comparison of available JS Testing frameworks

Introduction to Jasmine Framework

Examples

Jasmine Framework practical's

Karma Framework practical’s

Sikandar Ahmed | Lead Software EngineerAhmad Awais | Software Engineer

WHY Unit Testing


Types of Tests


Overview


What is Unit Test

–Verifies an atomic piece of code

–Test on specific behavior

–Each test is autonomous


Why Unit Testing

Consider building a Consider building a car from start to car from start to finish, each of the finish, each of the parts which make parts which make the engine, the the engine, the chassis, the wheels, chassis, the wheels, must be individually must be individually verified to be in verified to be in working order before working order before they are to be they are to be assembled into a assembled into a 'car'.'car'.


Unit Tests are written by developers!


Increase confidence in code

Fearlessly change your code

Discover usability issues early

Test is not a Unit if

Interact over parts of system.

Take too much time to execute (>0.01 Sec).

Require Manual Setup.


Unit Test Best Practices


1. Consistent

2. Atomic

3. Single Responsibility

4. Self Descriptive


Single Responsibility


1. One condition per test

2. One reason to change

Unit Test Best Practices


Difficult Scenarios


Difficult Scenarios

Continue..

– Mocks

– Stubs

– Fake

Levels of TDD


– Acceptance TDD(ATDD)

– Developer TDD

Test Driven Development

•Write TestWrite Test•Fail the testFail the test

•Write Minimum CodeWrite Minimum Code•Pass the testPass the test

•Re factor CodeRe factor Code•Meet standardsMeet standards


Why Test Driven Development




TDD is not about Testing

TDD is about

–Design and Development

•By testing first you design your code

Unit Testing and TDD




Rules for Extreme Programming

1. User stories (planning)2. Small releases3. Metaphor (standardized naming schemes)4. Collective ownership5. Coding standard:6. Simple design7. Refactoring8. TDD9. Pair programming10.Continuous integration11.40-hour workweek12.On-site customer

XP– Contd.

Comparison of JS Unit Testing Frameworks

Framework Suitable forDirect access to

JavaScript DOM APIRemote control

File watching

File preprocessing

Tests written in

Karmaunit yes yes yes yes yes any

JSTestDriverunit yes yes yes no no JS

Seleniume2e no yes yes no no any

WebDrivere2e no yes yes no no any

Jasmineunit yes yes no no no JS


Jasmine Framework

• Jasmine is a behavior-driven development framework for testing your JavaScript code. It does not depend on any other JavaScript frameworks. It does not require a DOM.

Jasmine API includes features such as:

• A more natural BDD syntax for organizing the test logic than JUnit style assertion test frameworks• Asynchronous testing• Mocks• Easy to create custom matchers• Ability to share or isolate behaviors between tests within a spec encapsulating parts of your spec.• Continuous integration support


Jasmine Framework: Syntax

Jasmine aims to be easy to read. A simple hello world test looks like this:

describe('Hello world', function() { it('says hello', function() { expect(helloWorld()).toEqual("Hello world!"); });});


Jasmine Framework: Test Suite and Test Cases

describe('MyApp Test Suite:', function() { });

• The above “Describe” block defines the test suite in Jasmine, in test suite single or multiple test cases can be written.

it('Should contain no JavaScript coding errors!', function() { expect(errorCount).toBe(0); });

• This above “It” block is representing the test cases which can written in Describe block. Expect showing the expected result for the particular test case.


Example

Example

Jasmine Framework: Spec and JS Code

A Jasmine test case is written as follows:

// your applications custom code

function addValues( a, b ) { return a + b; };

// the Jasmine test code

describe("addValues(a, b) function", function() { it("should equal 3", function(){ expect( addValues(1, 2) ).toBe( 3 ); }); it("should equal 3.75", function(){ expect( addValues(1.75, 2) ).toBe( 3.75 ); }); it("should NOT equal '3' as a String", function(){ expect( addValues(1, 2) ).not.toBe( "3" ); }); });


Jasmine Framework: Spec Runner (Running the Unit Tests)

Launching the SpecRunner.html file in your local browser runs the tests. Jasmine provides a nice view of the test results.


Jasmine Framework: Pros and Cons

Pros:• Should not be tied to any browser, framework, platform, or host language.• Should have idiomatic and unsurprising syntax.• Should work anywhere JavaScript can run, including browsers, servers, phones, etc.• Shouldn't intrude in your application's territory (e.g. by cluttering the global namespace).• Should play well with IDEs (e.g. test code should pass static analysis).• It should integrate easily with continuous build systems.• It should be simple to get started with.

Cons: Not Much examples available




Basic general test cases

Rainy Days

Sencha Project unit tests

Karma Practical App – ToDo App

Practical Example

Jasmine can Use with

• Ruby (with or without Rails)• Spider Monkey• Node.js• JS Test Driver• Java (with Maven)• DOT NET• PERL• Scala


Testing in Angular JS


References

http://evanhahn.com/how-do-i-jasmine/

http://pivotal.github.io/jasmine/

http://stackoverflow.com/questions/300855/javascript-unit-test-tools-for-tdd

http://docs.angularjs.org/tutorial

http://edspencer.net/2013/07/28/jasmine-and-jenkins-continuous-integration/

http://stackoverflow.com/questions/3459287/whats-the-difference-between-a-mock-stub


Q&A

Thanks for Attending
