2016-03-23 14 views
2

Boole değiştirildiğinde açılır listeyi kontrol etmeye çalışıyorum. boolean boolean bir @Input olduğunda yapılması gerekir farklı bir şey tahmin ediyorum bileşeniAngular2 testi - değişiklikleri algılamıyor

@Component({ 
    selector: 'dropdown', 
    directives: [NgClass], 
    template: ` 
     <div [ngClass]="{open: open}"> 
     </div> 
    `, 
}) 

export class DropdownComponent { 
    @Input('open') open: boolean = false; 
} 

Ve testin

it('should open', injectAsync([TestComponentBuilder], (tcb: TestComponentBuilder) => { 
    return tcb.createAsync(DropdownComponent) 
    .then(fixture => { 
     let el = fixture.nativeElement; 
     let comp: DropdownComponent = fixture.componentInstance; 

     expect(el.className).toEqual(''); 

     comp.open = true; 
     fixture.detectChanges(); 
     expect(el.className).toEqual('open') 
    }); 
})); 

bir girdidir?

cevap

4

<div [ngClass]="{open: open}"> sınıfında open sınıfını ayarlıyorsunuz, ancak DropdownComponent'da denetleniyorsunuz. Bu aynı değil. Böyle

Bir şey bir örnek için de How do I trigger a ngModel model update in an Angular 2 unit test?

var div = fixture.nativeElement.querySelector('div'); 
expect(div.className).toEqual('open'); 

veya

var div = fixture.debugElement.query(By.css('div')); 
expect(div.className).toEqual('open'); 

Bkz istediğini yapmalıdır.

+0

Ben "el" in konsol.log ve ben bir div oldu. Peki, nativeElement baştan nedir? Bileşenin üstünde biraz konteyner var mı? – Cuel

+1

Bileşeninizin seçicisi olan 'dropdown' olmalıdır. Elemanın çocuğu 'div' olmalıdır. Belki de 'TestComponentBuilder' bileşeniniz için uygun bir etiket oluşturmuyordur. Bunu yakından incelemedim. –