Componente Angular2: Testando a alteração do valor de entrada do formulário

Eu tenho uma entrada de texto e estou ouvindo as alterações.

mycomponent.ts

ngOnInit() {
    this.searchInput = new Control();
    this.searchInput.valueChanges
        .distinctUntilChanged()
        .subscribe(newValue => this.search(newValue))
}
search(query) {
    // do something to search
}

mycomponent.html

<search-box>
    <input type="text" [ngFormControl]="searchInput" >
</search-box>

Executando o aplicativo tudo funciona bem, mas eu quero testá-lo.

Então aqui está o que eu tentei

mycomponent.spec.ts

beforeEach(done => {
    createComponent().then(fix => {
        cmpFixture = fix
        mockResponse()
        instance = cmpFixture.componentInstance
        cmpFixture.detectChanges();
        done();
    })
})
describe('on searching on the list', () => {
        let compiled, input
        beforeEach(() => {
            cmpFixture.detectChanges();
            compiled = cmpFixture.debugElement.nativeElement;
            spyOn(instance, 'search').and.callThrough()
            input = compiled.querySelector('search-box > input')
            input.value = 'fake-search-query'
            cmpFixture.detectChanges();
        })
        it('should call the .search() method', () => {
            expect(instance.search).toHaveBeenCalled()
        })
    })

O teste falha como o.search() O método não é chamado.

Eu acho que tenho que definir ovalue de outra maneira, para que o teste perceba a mudança, mas eu realmente não sei como.

Alguém tem ideias?

questionAnswers(2)

yourAnswerToTheQuestion