如何在 Angular 1.5 组件中对具有不同名称的绑定进行单元测试?
How do you unit test a binding with a different name in an Angular 1.5 component?
我有以下组件:
angular.module('foo')
.component('searchInput', {
bindings: {
text: "<query"
},
templateUrl: 'components/searchInput/searchInput.html',
controller: 'SearchInputCtrl'
});
以下通过:
expect(component.text).toBe('bar');
我必须使用以下代码:
var component = $componentController('searchInput',
{$scope: {}},
{
text: 'bar'
}
);
但是,我想测试绑定到 'text' 的值是否来自 'query'。这 不 工作:
var component = $componentController('searchInput',
{$scope: {}},
{
query: 'bar'
}
);
你可以通过编译组件来测试这种东西。例如
inject(function($compile, $rootScope) {
var parentScope = $rootScope.$new();
parentScope.myVar = 'test';
var element = angular.element('<search-input query="myVar"></search-input>');
var compiledElement = $compile(element)(parentScope);
parentScope.$digest();
var scope = compiledElement.isolateScope();
expect(scope.$ctrl.text).toBe('test');
});
我有以下组件:
angular.module('foo')
.component('searchInput', {
bindings: {
text: "<query"
},
templateUrl: 'components/searchInput/searchInput.html',
controller: 'SearchInputCtrl'
});
以下通过:
expect(component.text).toBe('bar');
我必须使用以下代码:
var component = $componentController('searchInput',
{$scope: {}},
{
text: 'bar'
}
);
但是,我想测试绑定到 'text' 的值是否来自 'query'。这 不 工作:
var component = $componentController('searchInput',
{$scope: {}},
{
query: 'bar'
}
);
你可以通过编译组件来测试这种东西。例如
inject(function($compile, $rootScope) {
var parentScope = $rootScope.$new();
parentScope.myVar = 'test';
var element = angular.element('<search-input query="myVar"></search-input>');
var compiledElement = $compile(element)(parentScope);
parentScope.$digest();
var scope = compiledElement.isolateScope();
expect(scope.$ctrl.text).toBe('test');
});