1. UnitTesting Of JavaScript and Angularjs Application Using
Karma-Jasmine Framework -Samyak Bhalerao
([email protected]/[email protected])
2. Agenda What is testing? Black box testing vsWhite box
testing What is Unit testing? Prerequisites What is Jasmine?
Rules/Specs for writing test cases using jasmine What is Karma? How
to configure Karma How to create Karma configuration file Testing
sample JavaScript Unit Testing Of JavaScript and Angularjs
Application Using Karma-Jasmine Framework 4/17/2015
3. Agenda Testing Angularjs application Testing Controller
Testing variables Testing functions Testing Service Testing
Directive Directive without external html template Directive with
external template Testing filters Testing http
requests(GET,POST,etc) Unit Testing Of JavaScript and Angularjs
Application Using Karma-Jasmine Framework 4/17/2015
4. What is Testing ? Testing is the process of evaluating a
system or its component(s) with the intent to find whether it
satisfies the specified requirements or not. Testing is executing a
system in order to identify any gaps, errors, or missing
requirements in contrary to the actual requirements. Unit Testing
Of JavaScript and Angularjs Application Using Karma-Jasmine
Framework 4/17/2015
5. Black box testing vs White box testing Black box testing:
The technique of testing without having any knowledge of the
interior workings of the application is called black-box testing
The tester is oblivious to the system architecture and does not
have access to the source code Typically, while performing a
black-box test, a tester will interact with the system's user
interface by providing inputs and examining outputs without knowing
how and where the inputs are worked upon. Inefficient testing, due
to the fact that the tester only has limited knowledge about an
application. Unit Testing Of JavaScript and Angularjs Application
Using Karma-Jasmine Framework 4/17/2015
6. Black box testing vs White box testing White box testing
White-box testing is the detailed investigation of internal logic
and structure of the code. White-box testing is also called glass
testing or open-box testing. The tester needs to have a look inside
the source code and find out which unit/chunk of the code is
behaving inappropriately. It helps in optimizing the code. Extra
lines of code can be removed which can bring in hidden defects.
Unit Testing Of JavaScript and Angularjs Application Using
Karma-Jasmine Framework 4/17/2015
7. What is Unit testing? This type of testing is performed by
developers before the setup is handed over to the testing team to
formally execute the test cases The goal of unit testing is to
isolate each part of the program and show that individual parts are
correct in terms of requirements and functionality. There is a
limit to the number of scenarios and test data that a developer can
use to verify a source code. Unit Testing Of JavaScript and
Angularjs Application Using Karma-Jasmine Framework 4/17/2015
8. Prerequisites Install nodejs Install it in any folder of
your choice Download nodejs suitable setup file from
https://nodejs.org/download/ website Install nodejs using setup
file Run node version in command prompt to check node version
Install npm Node Package Manager(npm) Run npm version to check
installation of npm 4/17/2015Unit Testing Of JavaScript and
Angularjs Application Using Karma-Jasmine Framework
9. What is Jasmine? Jasmine is a behavior-driven development
framework for testing JavaScript code It does not depend on any
other JavaScript frameworks It does not require a DOM
http://jasmine.github.io/2.2/introduction.html Unit Testing Of
JavaScript and Angularjs Application Using Karma-Jasmine Framework
4/17/2015
10. What is Jasmine? Rules/Specs for writing test cases using
jasmine describe(string ,function(){ }) block A test suite begins
with a call to the global Jasmine function describe It accepts two
parameters first is string and second is function() String is a
name or title for test suit or test cases. It usually describes
what is being tested Function is block of code that implements test
cases Any number of nesting of describe block is possible Eg .
describe(Testing sampleApp.js :,function(){ //code to implement
test case goes here }); Unit Testing Of JavaScript and Angularjs
Application Using Karma-Jasmine Framework 4/17/2015
11. What is Jasmine? Rules/Specs for writing test cases using
jasmine beforeEach(function(){ }); This block is executes before
test cases It is used to load modules before execution of test
cases afterEach(function(){ }); This block is executed after each
test cases It is use for task like flushing memory , destroying
instance etc. 4/17/2015Unit Testing Of JavaScript and Angularjs
Application Using Karma-Jasmine Framework
12. What is Jasmine? Rules/Specs for writing test cases using
jasmine it(string , function(){ }) block Specs or test cases are
defined by calling jasmine global function it() Variables declared
inside describe() block are accessible to all it block within it.
It accepts two parameters first is string and second is function()
String is a name or title for test suit or test cases. It usually
describes the expected behavior or functionality of block of code
Function is block of code that implements test cases. It contains
one or more expectations that test the state of the code. All
assertions to test the code are inside this function A spec with
all true expectations is a passing spec. A spec with one or more
false expectations is a failing spec. Eg . It(expect true to be
true,function(){ expect(true).toBe(true); }); Unit Testing Of
JavaScript and Angularjs Application Using Karma-Jasmine Framework
4/17/2015
13. What is Jasmine? Rules/Specs for writing test cases using
jasmine Expectations Expectations are built with the function
expect() which takes a value, called the actual. It is chained with
a Matcher function(eg. .toBe(),.toBeTruthy()), which takes the
expected value. Each matcher implements a boolean comparison
between the actual value and the expected value. It is responsible
for reporting to Jasmine if the expectation is true or false.
Jasmine will then pass or fail the spec. Any matcher can evaluate
to a negative assertion by chaining the call to expect with a not
before calling the matcher. Eg. expect(true).toBe(true);
expect(true).not.toBe(false); Unit Testing Of JavaScript and
Angularjs Application Using Karma-Jasmine Framework 4/17/2015
14. What is Jasmine? Rules/Specs for writing test cases using
jasmine Expectations Jasmine has a rich set of matchers included.
expect().toBe(), expect().not.toBe();('toBe' matcher compares with
===)
expect().toHaveBeenCalled(),expect().toHaveBeenCalledWith().(it
check for method call) expect().toBeDefined(),
expect().toBeUndefined().(compares for defined/defination )
expect().toEqual(),expect().not.toEqual();(it is used for simple
literals and variables) expectGET(url,data).respond(),
expectPOST(url,data).respond(),
expectDELETE(url,data).respond(),etc.(it is used for http request
assertion) expect().toBeNull().(compared against null)
expect().toBeTruthy(),expect().toBeFalsy()..(use for Boolean
casting testing) expect().toContain()..(use for pattern matching)
expect().toMatch().(it is used for regular expression) Unit Testing
Of JavaScript and Angularjs Application Using Karma-Jasmine
Framework 4/17/2015
15. What is Karma? Karma is TEST RUNNER Tool to spawn a web
server that executes source code against test code Can run tests
for different browsers Provides watches for source files, whenever
file changes it triggers the test run and run tests again
http://karma-runner.github.io/0.12/intro/installation.html
4/17/2015Unit Testing Of JavaScript and Angularjs Application Using
Karma-Jasmine Framework
16. Karma Configuration Steps 4/17/2015Unit Testing Of
JavaScript and Angularjs Application Using Karma-Jasmine
Framework
17. Create Karma Configuration File (karma.config.js)
4/17/2015Unit Testing Of JavaScript and Angularjs Application Using
Karma-Jasmine Framework