Steps to set up UnitTest for js
-
According to the angularjs official document here, we select Karma, Jasmine,
We can write our Test code accroding to the example of Jasmine. -
Karma is the Test Runner, Jasmine is the Test Framework. Now, we start our trip of js unit Testing.
-
Prepare the environment.
. install Karma
we can follow these steps to install and configure karma
step1. install npm, we can download the MSI, current, we chose the v0.12.9,
step2. install karma, karma-Jasmine, karma-chrome-launcher karma-cli. using these commands:
npm install karma --save-dev
npm install karma-jasmine karma-chrome-launcher --save-dev
npm install karma-core --save-dev // we can install according to our requirements.
step3. we can start to configure the file by running karma init
. then we can configure the configure file with the default name: karma.conf.js.
- we can use Jasmine to writing our test case.
To show an example,
src.js
function testController($scope) {
var mySelf = this;
$scope.test = false;
}
angular.module("App", ["ngDialog"])
.controller("Test",
{
controller: testController,
controllerAs:t
});
test.js
describe("myHelloWorld", function () {
beforeEach(module("App"));
var tmp,scope;
beforeEach(inject(function ($rootScope, $controller) {
// scope = $rootScope.$new();
scope = { test: true };
tmp = $controller("Test", { $scope: scope });
}))
it("Test", function () {
expect(scope.test).not.toEqual(true);
})
})
karma.conf.js
// Karma configuration
// Generated on Tue Nov 01 2016 01:21:48 GMT-0400 (Eastern Daylight Time)
module.exports = function(config) {
config.set({
// base path that will be used to resolve all patterns (eg. files, exclude)
basePath: '',
// frameworks to use
// available frameworks: https://npmjs.org/browse/keyword/karma-adapter
frameworks: ['jasmine'],
// list of files / patterns to load in the browser
Be careful with the order of the files and the dependency relationship between them. as they will be loaded one by one.
files: [
'ERP_Dev/ERP_Dev/ERP/ERPWeb/Scripts/angular.js',
'ERP_Dev/ERP_Dev/ERP/ERPWeb/Scripts/angular-mocks.js',
'ERP_Dev/ERP_Dev/ERP/ERPWeb/Scripts/ngDialog.js',
'ERP_Dev/ERP_Dev/ERP/ERPWeb/Scripts/ngDialog.min.js',
'ERP_Dev/ERP_Dev/ERP/ERPWeb/App_Client/Components/Common/src.js',
'ERP_Dev/ERP_Dev/ERP/ERPWeb/App_Client/Components/Orders/test.js'
],
// list of files to exclude
exclude: [
],
// preprocess matching files before serving them to the browser
// available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
preprocessors: {
},
// test results reporter to use
// possible values: 'dots', 'progress'
// available reporters: https://npmjs.org/browse/keyword/karma-reporter
reporters: ['progress'],
// web server port
port: 9876,
// enable / disable colors in the output (reporters and logs)
colors: true,
// level of logging
// possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
logLevel: config.LOG_INFO,
// enable / disable watching file and executing tests whenever any file changes
autoWatch: true,
// start these browsers
// available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
browsers: ['Chrome'],
// Continuous Integration mode
// if true, Karma captures browsers, runs the tests and exits
singleRun: false,
// Concurrency level
// how many browser should be started simultaneous
concurrency: Infinity
})
}