如何使用Jasmine填充和测试Datalist角度指令

时间:2016-02-03 13:31:17

标签: javascript angularjs angularjs-directive jasmine



module.directive('dcsComboList', ['dcsComboListConfig', function (dcsComboListConfig){
    return{
        restrict: 'E',
        scope: {
            /**
             * @doc property
             * @propertyOf Custom Controls.Input Controls.dcsComboList
             * @name items
             * @description
             * Use the items property to bind an items source to the combolist.
             */
            items: '=?',
          }
     };
}]);




我有一个angularjs指令,它由两个输入和datalist组成。 这是我的部分指令与测试。



describe('dcsComboList', function() {

    //#region Variable Initialization
    var DIR_NAME = 'dcs-combo-list';
    var rootScope;
    var compile;
    var element;


    beforeEach(
        angular
            .mock
            .module('DcsPlus.Controls')
    );

    beforeEach(inject(function($compile, $rootScope){
        compile = $compile;
        rootScope = $rootScope;


    }));

    //#region Directive Construction
    function constructComboList(Items, isEnabled, isShowUnit, unitText, selectedItem ){

        var html;
        html = '<' + DIR_NAME;

        if (angular.isDefined(Items)){
            html +=' data-items="' + Items + '"';
        }

       //more attributes come here

        html +='/>';
        element = compile(html)(rootScope);
        rootScope.$apply();
    }
    //#endregion

    //#region Tests
    it('should be disabled', function(){
        constructComboList("One",false);
        expect(element.attr('data-enabled')).toBe('false');
    });
&#13;
<div class="inputDiv">
            <input
                    list="id"
                    
        </div>
        <div class="unitDiv">
            <input data-ng-if="showUnitText"
                   data-type="text"
                   data-ng-model="unitText"
                   data-enabled="enabled"
                   readonly
                   />
        </div>
        <datalist id="id">
            <option data-ng-repeat="item in items | orderBy:orderBy " data-value="{{item}}">
                {{item}}
            </option>
        </datalist>
&#13;
&#13;
&#13;

现在,我正在尝试测试我的指令。

我想测试的内容:填充数据列表,如果项目填充正确,则测试它:大小等。

我该怎么做?

最好,

0 个答案:

没有答案