使用茉莉花測試角度指令

我已經創建了一個指令，用於根據從下拉列表中選擇的值更新一個具有特定值的文本框。使用茉莉花測試角度指令

因此，如果電影是從下拉列表中選擇，然後 - 插入文本框「演員/標題/導演， alltitles =「關鍵詞」等

使用茉莉我目前正試圖測試這個行爲了。問題是，我的測試代碼，當我在下拉列表中選擇不同的值時，它不會觸發我的指令，導致我的測試用例失敗。

我不知道我要去哪裏錯了？

指令

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'); 
}); 
}

感謝

來源

2014-01-05 user3162979

您需要將範圍與scope = $rootScope.$new();

設置爲新rootscope除非你提供確切的錯誤代碼那裏有沒有多少人知道了。

Ode to Code blog對Angular的一些簡單單元測試有很好的指導，您可能會發現很有幫助。

來源

2014-07-10 19:31:23 Freezepop9178

使用茉莉花測試角度指令

回答

相關問題