AngularJS testavimas
AngularJS testavimas
-
Testavimo įrankiai
-
Kodas testuojamas kai...
-
Ką reikia testuoti
-
Testų rašymas
-
Testų rezultatai
-
Kodo dengiamumas testais
-
Node.js
-
Karma
-
Jasmine
Testavimo įrankiai
Kodas testuojamas, kai...
-
DOM manipuliacijos atskirtos nuo kontrolerio logikos
Kodas testuojamas, kai...
-
Direktyvų kontroleriai – savarankiškos funkcijos
function myDrctvCtrl($scope) {
$scope.title = 'Hello world!';
}
angular.controller('MyDrctvCtrl', myDrctvCtrl)
.directive('myDrctv', function(){
return {
templateUrl:'template.html',
restrict: 'E',
controller: 'MyDrctvCtrl'
}
});
-
Serverio užklausos daromos iš atskiro serviso
Kodas testuojamas, kai...
function serverService($q, $http) {
var onSuccess = function(response) {
return response.data;
};
var onError = fuction(response) {
if (!angular.isObject( response.data ) || !response.data.message) {
return( $q.reject("An unknown error occurred."));
}
return($q.reject(response.data.message));
};
var getItems = function() {
var request = $http({
method: 'GET',
url: '/items'
}).then(onSuccess, onError);
return request;
};
return {
getItems: getItems
};
}
Ką reikia testuoti
-
Input'ą ir output'ą
Testų rašymas
-
Testo struktūra
describe('Very descriptive title', function() {
beforeEach(function(){...});
afterEach(function(){...});
it('should do something', function() {
expect(...)...;
})
});
Testų rašymas
-
Aiški testo antraštė
describe("Very super descriptive title", function() {...});
Testų rašymas
-
Direktyvos testavimas
app.directive('helloWorld', function () {
return {
restrict: 'E',
replace: true,
template: '<h1>I say {{1000 * 1000}} times Hello World!'</h1>'
};
});
describe('Hello world! example', function() {
var compile,
rootScope;
beforeEach(module('myApp'));
beforeEach(inject(function($compile, $rootScope) {
compile = $compile;
rootScope = $rootScope;
}));
it('Replaces the element with the appropriate content', function() {
var element = $compile("<hello-world></hello-world>")(rootScope);
$rootScope.$digest();
expect(element.html()).toContain('I say 1000000 times Hello World!');
});
});
Testų rašymas
-
Kontrolerio testavimas
'use strict';
describe('Title for spec suite', function () {
var MyDrctvCtrl , scope;
beforeEach(inject(function($rootScope, $controller) {
scope = $rootScope.new();
MyDrctvCtrl = $controller('MyDrctvCtrl', {
$scope: scope
});
});
});
it("should set title 'Hello world!'", function() {
expect(scope.title).toBe('Hello world!');
});
});
Testų rašymas
-
Serverio serviso testavimas
'use strict';
describe('ServerService test', function() {
var httpBackend,
serverService;
beforeEach(inject(function($httpBackend, $injector) {
httpBackend = $httpBackend;
$httpBackend.when('GET', '/items').respond([{id: 1, name: 'Item'}]);
serverService = $injector.get('ServerService');
}));
it('should get item array', function() {
httpBackend.expectGET('/items');
serverService.getItems().then(function(response) {
expect(JSON.stringify(response).toBe('[{"id": 1, "name": "Item"}]'))
});
httpBackend.flush();
});
});
Testų rašymas
-
Kuo mažiau expect'ų it'e – tuo geriau
describe("'Hello world!' example", function() {
...
it('should check is title set', function(){
expect(scope.title).toBe('Hello world!');
});
...
});
Testų rezultatai
-
Automatinis testų veikimas programavimo metu
module.exports = function(config) {
config.set({
...
autoWatch: true,
singleRun: false
...
});
});
Kodo dengiamumas testais
-
Istanbul
-
npm install karma-coverage
-
Karma konfigūravimas
module.exports = function(config) {
config.set({
...
preprocessors: {
'**/lib/*.js': ['coverage']
},
coverageReporter: {
reporters: [
{type: 'html', dir: 'coverage/'}}
]
},
...
});
});
Kodo dengiamumas testais
-
karma start
Klausimai
AngularJS Testing
By giedrius
AngularJS Testing
- 1,263