Question

我创建了一个指令，根据从下拉列表中选择的值更新具有特定值的文本框。

所以如果从下拉列表中选择了电影，那么在文本框中插入“Actor / Title / Director”， alltitles =“keyword”等

使用jasmine我正在尝试测试这种行为。问题是，我的测试代码，当我在下拉列表中选择不同的值时，它不会触发我的指令，导致我的测试用例失败。

我不知道我哪里出错了？

的指令 的

myAppmodule.directive("updateSearchCategory", function (mainSearchFactory) {
return {
    link: function (scope, element, attrs) {
        scope.$watch("searchCategory", function (newValue) {
            if (mainSearchFactory.mainSearchInitialText != null) {
                var text = mainSearchFactory.mainSearchInitialText(newValue); // create interface in javascript
                angular.element(element).val(mainSearchFactory.mainSearchInitialText(newValue));
            }
            else {
                throw { ErrorType: "NullReferenceException", Message: "argument passed in was null", Location: "updateTextDependingonSelectedItem directive" };
            }

        })
    }
}

}）;

测试代码

 describe('updateTextDependingOnSelectedItem', function () {

var element;

beforeEach(module('myApp'));
beforeEach(inject(function ($compile, $rootScope) {

    // set up the scope
    var scope = $rootScope;
    scope.DropDownItems = ["All Titles", "Movies", "Games"];
    scope.searchCategory = scope.DropDownItems[0];

    //create and compile the directive
    element = angular.element('<div id="MainPageHeader">' +                   
                '<select data-ng-model="searchCategory" data-ng-options="item for item in   DropDownItems" class="itemTypesDropDownList"></select>' +
                '<input type="text" id="headerSearch" update-search-                              category="searchCategory" />' +
                '</div>');

    $compile(element)(scope);
    scope.$digest();
    console.log(element[0].outerHTML);
}));

  it('when movies is selected add text "Actor/Title/Director" to search textbox', function () {
    element.find('.itemTypesDropDownList').val(2);  // 1 is index number for Movies
    expect(element.find('#headerSearch').val()).toContain('Actor/Title/Director');
});
}

由于

Answer 1

您需要使用scope = $rootScope.$new();

将范围设置为新的rootcope

除非你提供确切的错误代码，否则我看到的并不多。

Ode to Code blog对Angular的一些简单单元测试有很好的指导，你可能会觉得有用。

使用jasmine测试角度指令

1 个答案: