Question

我目前遇到的问题是我无法获得在标签上运行的指令。我是单位测试和角度的新手，所以请描述我做错了什么，或者我应该调查什么。

指令

.directive('documents', function (){
    return {
        restrict: 'E',
        templateUrl: '/abc/def/documents.html'
    };
})

单元测试

beforeEach(module('myApp.home'));
var $rootScope;
beforeEach(inject(function (_$rootScope_) {
    $rootScope = _$rootScope_;
}));

describe('Documents Directive', function (){
    var $compile;
    beforeEach(inject(function (_$compile_, $httpBackend) {
        $compile = _$compile_;
        $httpBackend.when('GET', '/abc/def/documents.html').respond("What To Put here!");
    }));

    it('Should call documents.html', function () {
        var element = $compile("<documents>This should be hashed out</documents>")($rootScope);
        console.log(element);
        $rootScope.$digest();
        console.log(element);
        console.log(element.html());
        expect(element.html()).toContain("Documents");
    });

});

documents.html

<h2>Documents</h2>

运行测试时，这些是我的结果：

INFO [watcher]: Changed file "C:/webroot/member_portal/app/home/home_test.js".
LOG: Object{0: <documents class="ng-scope"></documents>, length: 1}
LOG: Object{0: <documents class="ng-scope"></documents>, length: 1}
LOG: ''
Chrome 45.0.2454 (Windows 7 0.0.0) myApp.home module Documents Directive Should call documents.html FAILED
    Expected '' to contain 'Documents'.
        at Object.<anonymous> (C:/webroot/member_portal/app/home/home_test.js:265:36)
Chrome 45.0.2454 (Windows 7 0.0.0): Executed 1 of 47 (1 FAILED) (skipped 46) ERROR (0.563 secs / 0.01 secs)

Answer 1

以下代码按预期工作。你需要在调用$ httpBackend.flush（）之后调用你的期望;对/abc/def/documents.html的调用是异步调用，因此在调用flush（）之前不会解析它。

另一种解决方案是预编译模板文件。这将消除使用$ httpBackend的需要。您可以找到文档here并搜索Stack Overflow以获取大量示例。

describe('', function(){

    beforeEach(module('myApp.home'));
    var $rootScope;
    beforeEach(inject(function (_$rootScope_) {
        $rootScope = _$rootScope_;
    }));

    describe('Documents Directive', function (){
        var $compile, $httpBackend, expectedResults = '<h2>Documents</h2>';
        beforeEach(inject(function (_$compile_, _$httpBackend_) {
            $compile = _$compile_;
            $httpBackend = _$httpBackend_;
            $httpBackend.expectGET('/abc/def/documents.html').respond(200, expectedResults);
        }));

        it('Should call documents.html', function () {
            var $element = $compile("<documents>This should be hashed out</documents>")($rootScope);
            $rootScope.$digest();
            $httpBackend.flush();
            expect($element.eq(0).html()).toEqual(expectedResults);
        });

    });
});

角度单元用httpBackend测试指令

1 个答案: