Проверка проверки формы AngularJS

Question

Иногда формы становятся очень сложными, и невозможно проверить каждый случай вручную после изменения кода. У меня уже есть модульное тестирование с кармой по проекту.

Есть ли какие-либо инструменты или лучшие практики, как проверить правильность формы AngularJS с помощью жасмина и кармы?

Например, как я могу проверить такую ​​форму с жасмином и кармой автоматически?

<form name="appForm" novalidate> 
    <div> 
     Username: <input type="text" ng-model="data.username" name="username" ng-maxlength="15" required /> 
    </div> 
    <div> 
     Email: <input type="email" ng-model="data.email" name="email" required /> 
    </div> 
    <div> 
     Age: <input type="number" ng-model="data.age" name="age" /> 
    </div> 
    <div> 
     <button ng-click="submit()" ng-disabled="appForm.$invalid">Submit</button> 
    </div> 
</form> 

Answer 1

Это зависит от того, что вы на самом деле хотите проверить при проверке проверки формы.

Если вы хотите быть уверенным, что неверная форма не будет отправлена, то это один случай. И я не вижу проблем с этим делом.

Если вы хотите быть уверены в том, что соответствующие сообщения отображаются для поврежденных полей, то, к примеру, вы можете сделать директиву, что знает обо всех ваших возможных ограничений на местах ('required', 'ng-maxlength', 'url' и т.д.) и отвечает за отображение соответствующих сообщений об ошибках. Поэтому вам нужно будет создавать тесты только для этой директивы.

Пример:

<input type="text" ng-model="data.username" my-directive name="username" ng-maxlength="15" required /> 

myDirective осознает required и ng-maxlength ограничения, которые были введены на поле, & он отвечает за отображение соответствующих сообщений об ошибках для недопустимого состояния поля.