Question

在我的一个单元测试中，我试图测试当我在输入元素上设置setPristine时是否删除了ng-dirty。在元素上调用setPristine后，我可以看到ng-dirty没有被删除。

我有一种感觉，我错误地调用了setPristine方法。

我试图测试的逻辑如下

在输入中添加文字
测试ng-dirty设置setPristine
然后再次检查ng-dirty

名词

/** 
    Add text to your input,
    then test for ng-dirty set the setPristine,
    then check for ng-dirty again. 
*/
it('should set pristine', function() {
    element = angular.element('<input ng-model="temp"></input>');
    element = compile(element)(scope);
    scope.$digest();
    element.val("Some Input");
    element.triggerHandler("change");
    expect(element.hasClass('ng-dirty')).toBe(true);    
    element.triggerHandler('setPristine');
    console.log(element);
    expect(element.hasClass('ng-dirty')).toBe(false);       
});

然后记录

<input ng-model="temp" class="ng-scope ng-valid ng-dirty">

有人能指出我正确的方向吗？

提前致谢

Answer 1

$setPristine是在Angular FormController和ngModelController上公开的方法。

因此，如果您有一个名为myForm的表单：

<form name="myForm"></form>
<div ng-form="myForm"></form>

您可以致电myForm.$setPristine()将其中的所有控件设置为原始状态。

同样的概念适用于个别控制：

<form name="myForm">
    <input name="myInput" ng-model="temp"></input>
</form>

您可以致电myForm.myInput.$setPristine()将该特定控件设置为pristine。

您不应该对正在添加/删除的ng-dirty类进行测试，而是要了解$setPristine本身的实现细节。如果Angular开发人员明天将ng-dirty更改为ng-filthy，那么您的测试就会中断。

相反，您可以相信Angular开发人员有自己的测试，涵盖CSS类的添加和删除，您应该关注测试代码正确调用$setPristine，即：

beforeEach(function () {
    element = angular.element(
        '<form name="myForm">' +
        '   <input name="myInput" ng-model="temp"></input>' + 
        '</form>'
    );
    element = compile(element)(scope);

    myForm = scope.myForm;
    spyOn(myForm, '$setPristine');
});

it('should set pristine', function () {
    // call your code

    // then assert
    expect(myForm.$setPristine).toHaveBeenCalled();
});

AngularJS，Karma - 使用setPristine清除脏

1 个答案: