반응형
AngularJS 1.x에서 필터를 단위 테스트하는 방법
Angular에서 필터를 어떻게 단위 테스트합니까?
주입 $filter
한 다음$filter('filterName')(input, options);
따라서이 템플릿과 동등한 것을 테스트하려면 {{ foo | testFilter:capitalize }}
describe('The test filter', function () {
'use strict';
var $filter;
beforeEach(function () {
module('myTestFilterModule');
inject(function (_$filter_) {
$filter = _$filter_;
});
});
it('should capitalize a string', function () {
// Arrange.
var foo = 'hello world', result;
// Act.
result = $filter('testFilter')(foo, 'capitalize');
// Assert.
expect(result).toEqual('HELLO WORLD');
});
});
$ filter를 삽입하고 테스트 할 필터를로드 할 수 있습니다. 그런 다음 주입 한 필터를 통해 필터링 할 매개 변수를 전달하고 필요한 것을 '기대'합니다. 다음은 그 예입니다.
describe('Filter test', function(){
var filter;
beforeEach(function(){
module.apply(moduleName);
inject(function($injector){
filter = $injector.get('$filter')('nameOfTheFilter');
});
});
it('should filter the parameters passed', function(){
expect(filter(parameterToBeFiltered)).toBe(Result);
});
});
필터를 테스트에 바로 삽입 할 수 있습니다 ( 여기 에서 스 니펫을 찾았 습니다 ).
describe('myApp', function () {
beforeEach(function () {
module('myApp');
});
it('has a bool filter', inject(function($filter) {
expect($filter('bool')).not.toBeNull();
}));
it("should return true empty array ", inject(function (boolFilter) {
expect(boolFilter(true)).toBeTruthy();
}));
});
이 예제에서 필터 이름은 'bool'입니다.이 필터를 삽입하려면 'bool'+ 'Filter'= 'boolFilter'를 사용해야합니다.
실제 $filter
서비스를 주입하는 것 외에 필터를 테스트하는 다른 방법이 있습니다 .
예:
describe('FILTER: myFilterName', function(){ // You can put anything in the string here,
// I like declaring FILTER: myFilterName, but it
// could be just the filter name.
var myTestTheFilterVariableName;
// This variable does not have to match the describe name, call it what you wish,
// but use this variable in any it blocks below.
beforeEach(module('obsidian')); // Include app - boilerplate.
beforeEach(inject(function(actualFilterNameFilter){
// If your test variable name is the same as 'actualFilterNameFilter' then you would
// use this name '_actualFilterNameFilter_' with underscores; The Angularjs injector will
// remove the underscores for you.
// IMPORTANT PART: The important part here is the trailing 'Filter' name. This is how Angularjs
// Knows to grab the filter title "actualFilterName" in this case.
myTestTheFilterVariableName = actualFilterNameFilter;
})); // This is where you actually include the filter for testing.
// Use the underscores if your variable name is the exact same as the injected parameter.
// This is where you would use your variable name from above.
it('should do something here', function(){
expect(myTestTheFilterVariableName(filterParameter)).toEqual(expectedResultHere);
});
});
여기에 실행 가능한 필터 테스트 예제가 있습니다.
angular.module('myModule', []).filter('multiplier', function() {
return function(number, multiplier) {
if (!angular.isNumber(number)) {
throw new Error(number + " is not a number!");
}
if (!multiplier) {
multiplier = 2;
}
return number * multiplier;
}
});
describe('multiplierFilter', function() {
var filter;
beforeEach(function() {
module('myModule');
inject(function(multiplierFilter) {
filter = multiplierFilter;
});
});
it('multiply by 2 by default', function() {
expect(filter(2)).toBe(4);
expect(filter(3)).toBe(6);
});
it('allow to specify custom multiplier', function() {
expect(filter(2, 4)).toBe(8);
});
it('throws error on invalid input', function() {
expect(function() {
filter(null);
}).toThrow();
});
});
<link href="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/jasmine-html.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jasmine/2.4.1/boot.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular-mocks.js"></script>
Note: this answer was created after the SO Documentation Sunset based on the AngularJS unit test filter example and a suggestion on Meta that all valuable documentation content should be converted into answers.
참고URL : https://stackoverflow.com/questions/21094569/how-to-unit-test-a-filter-in-angularjs-1-x
반응형
'Development Tip' 카테고리의 다른 글
C ++ 문자열의 문자 정렬 (0) | 2020.11.07 |
---|---|
읽기 전용 속성 또는 메서드를 사용하려면? (0) | 2020.11.07 |
Python의 표준 라이브러리에 정렬 된 컨테이너가없는 이유는 무엇입니까? (0) | 2020.11.07 |
스칼라에서 param : _ *는 무엇을 의미합니까? (0) | 2020.11.07 |
ON DUPLICATE KEY를 사용하여 삽입하려는 모든 것을 업데이트하는 방법이 있습니까? (0) | 2020.11.07 |