$timeout 中的以下代码永远不会被调用。我可以在那里放置任何我喜欢的错误测试并且测试总是通过(有一个类似的问题(Karma e2e testing: how to know when the DOM is ready?)但它没有提供解决方案):
it('should display a filter row when attribute sg-live-filtering is present', function()
{
angular.mock.inject(function($compile, $rootScope, $timeout) {
var elem = $compile('<div sg-grid sg-data="api/grid/accounts" sg-live-filtering></div>')(scope); // the angular-kendo grid
$rootScope.$apply();
var table = elem.find('table[role="grid"]'); // find the kendo grid
expect(table.length).toBe(1);
var header = table.find('thead'); // find the grid's table header
expect(header.length).toBe(1);
$timeout(function () {
// get the second row in the header and check it has a specific class
expect(header.find('tr').eq(1).hasClass('sg-grid-filter-row')).toBeTruthy();
// e.g. I could do this and it would still pass!!!
expect(header.find('tr').eq(500));
});
}
}
PhantomJS 1.9.2(Windows 7):执行 1 of 871(跳过 383)成功(0 秒 / 0
这是它在浏览器中的样子:
剑道网格是使用标准 angularjs 指令创建的:
angular.module('sgComponents').directive('sgGrid', [
templateUrl: 'sg-grid.html',
// lots of kendo code follows to build the grid
]);
外部 sg-grid.html 模板:
<div sg-grid sg-data="api/grid/accounts"
sg-live-filtering> <!-- the attribute I want to test -->
</div>
当指令代码运行时,会检查是否存在 sg-live-filtering attr。如果是,则调用实用程序函数将您在图像中突出显示的行附加到网格的表头:
if (attrs.sgLiveFiltering) {
/*
timeout is needed to ensure DOM is ready. COULD THIS BE THE PROBLEM?
*/
$timeout(function () {
/*
this function adds the filter row to the grid.
THE NEW ROW HAS CLASS 'sg-grid-filter-row' THAT I USE FOR TESTING
*/
buildGridFilterRow(elm, scope, attrs);
});
}