Угловое 2 RC5 Тестирование detectChanges не работает

Question

Я строю компонент LoginForm со следующим интерфейсом:

<login-form onlogin="submit()"></login-form> 

И это тестирование кода:

it("Should send credentials out of the component", async(() => { 
    TestBed.compileComponents().then(() => { 
     const fixture = TestBed.createComponent(LoginFormComponent); 
     let component = fixture.componentInstance; 
     spyOn(component.onlogin, "emit"); 

     let domRef = fixture.nativeElement; 
     domRef.querySelector("input[name='username']").value = "test@test.com"; 
     domRef.querySelector("input[name='password']").value = '1234'; 
     domRef.querySelector("form").dispatchEvent(new Event('submit')); 

     fixture.detectChanges(); 

     let expectedSubmitData:UserCredentials = { 
     username: "test@test.com", 
     password: "1234" 
     }; 
     expect(component.onlogin.emit).toHaveBeenCalledWith(expectedSubmitData); 
    }); 
    })); 

Я получаю это сообщение:

Expected spy emit to have been called with [ Object({ username: 'test@test.com', password: '1234' }) ] but actual calls were [ Object({ username: '', password: '' }) ] 

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

Answer 1

Пожалуйста, попробуйте сделать следующее. Это сработало для меня !!.

let domRef = fixture.nativeElement; 
let userInput = domRef.querySelector("input[name='username']") 
userInput.value = "test@test.com"; 
userInput.dispatchEvent(new Event('input')); 
let passwordInput = domRef.querySelector("input[name='password']") 
passwordInput.value = '1234'; 
passwordInput.dispatchEvent(new Event('input')); 
fixture.detectChanges(); 
domRef.querySelector("form").dispatchEvent(new Event('submit')); 
let expectedSubmitData:UserCredentials = { 
    username: "test@test.com", 
    password: "1234" 
}; 
expect(component.onlogin.emit).toHaveBeenCalledWith(expectedSubmitData);