Жасмин тест вход с рисунком

Question

У меня есть форма со следующим входом:

<input type="email" name="email" ng-model="register.form.email" ng-pattern="emailRegex">

Я хочу, чтобы проверить, что форма является недействительным, если пользователь недействительный адрес электронной почты:

it('...', function() { 
    form.email.$setViewValue('invalid'); 
    expect(form.email.$valid).toBeFalsy(); // OK 
    form.email.$setViewValue('invalid@');  
    expect(form.email.$valid).toBeFalsy(); // OK 
    form.email.$setViewValue('invalid@host');  
    expect(form.email.$valid).toBeFalsy(); // Not OK  
}); 

Последнее ожидание терпит неудачу, потому что вход действителен, хотя регулярное выражение электронной почты ожидает домен. Кажется, что шаблон не используется в моем тесте, потому что, когда я меняю тип на текст, он уже терпит неудачу при первом ожидании. Как я могу убедиться в том, что шаблон был выбран в тестах?

Для полноты, это регулярное выражение (не написано мной):

^[_A-Za-z0-9-]+(\.[_A-Za-z0-9-]+)*@[_A-Za-z0-9]+[_A-Za-z0-9-]*[_A-Za-z0-9]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$

Изменение типа к text не работал.

Я использую жасмин 2.4.1 и угловой 1.4.2. Я использую ngHtml2JsPreprocessor, как описано here, чтобы инициализировать форму в моих тестах.

Edit:

Это как сформировать инициализируются:

beforeEach(inject(function($rootScope, $templateCache, $compile) { 
    var $scope = $rootScope.$new(); 
    vm = $controller('RegisterController', {$scope: $scope}); 
    var templateHtml = $templateCache.get("register.html"); 
    var template = angular.element("<div>" + templateHtml + "</div>"); 
    $compile(template)($scope); 
    var form = $scope.registerForm; 
    $scope.$apply(); 
    scope = $scope; 
})); 

Answer 1

AngularJS до сих пор работает в пути, как он был разработан

angular.module('app', []) 
 

 
describe('Registration form',() => { 
 
    'use strict' 
 

 
    beforeEach(module('app')) 
 

 
    let form 
 
    let scope 
 

 
    beforeEach(inject(($rootScope, $compile) => { 
 
    scope = $rootScope.$new() 
 
    var formElem = ['<form name="registrationForm">', 
 
     '<input type="text" name="number" ng-model="input" ng-pattern="/^[_A-Za-z0-9-]+(\.[_A-Za-z0-9-]+)*@[_A-Za-z0-9]+[_A-Za-z0-9-]*[_A-Za-z0-9]+(\.[A-Za-z0-9]+)*(\.[A-Za-z]{2,})$/">', 
 
     '</form>' 
 
    ].join('') 
 
    $compile(formElem)(scope) 
 
    form = scope.registrationForm 
 
    })) 
 

 
    it('has no `$valid` state',() => { 
 
    expect(form.$valid).toBeTruthy() 
 
    form.number.$setViewValue('invalid email address') 
 
    expect(form.number.$valid).toBeFalsy() 
 
    }) 
 

 
    it('has `$valid` state',() => { 
 
    expect(form.$valid).toBeTruthy() 
 
    form.number.$setViewValue('some@valid.address') 
 
    expect(form.number.$valid).toBeTruthy() 
 
    }) 
 
})

<script src="https://safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine-2.0.3-concated.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-mocks.js"></script> 
 
<link href="https://safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine.css" rel="stylesheet" />

Answer 2

Я думаю, вы должны позвонить scope.$digest(); после использования form.email.$setViewValue, scope неоспоримым объема передается ваши $ компиляции. Это то, что я использовал в каждом тесте.

Вы также можете посмотреть более подробную информацию здесь: https://stackoverflow.com/a/22772504/4583079