155
rated 0 times
[
160]
[
5]
/ answers: 1 / hits: 42098
/ 8 Years ago, wed, june 8, 2016, 12:00:00
I'm currently putting together some best practices for testing Angular 2 apps on a component level.
I've seen a few tutorials query a fixture's NativeElement object for selectors and the like, e.g.
it('should render Hello World! after click', async(() => {
builder.createAsync(HelloWorld).then((fixture: ComponentFixture<HelloWorld>) => {
fixture.detectChanges();
let el = fixture.nativeElement;
el.querySelector('h1').click();
fixture.detectChanges();
expect(el.querySelector('h1')).toHaveText('Hello World!');
});
}));However, in juliemr's Angular 2 test seed she accesses the NativeElement through a parent DebugElement object.
it('should render Hello World! after click', async(() => {
builder.createAsync(HelloWorld).then((fixture: ComponentFixture<HelloWorld>) => {
fixture.detectChanges();
let compiled = fixture.debugElement.nativeElement;
compiled.querySelector('h1').click();
fixture.detectChanges();
expect(compiled.querySelector('h1')).toHaveText('Hello World!');
});
}));Are there any specific cases you'd use a fixture's debugElement.nativeElement over its nativeElement?
More From » unit-testing
