Angular 7 Jasmine单元测试：如何获取组件NativeElement？

Question

In my main component html there is a my-grid component

main.component.html

 <my-grid
    id="myDataGrid"
    [config]="gridOptions"
 </my-grid>

In main.component.specs.ts How can can I get my-grid NativeElement?

I have 1 test so far which checks that grid is being rendered

it('should render grid', () => {
     fixture = TestBed.createComponent(MainComponent);
     const compiled = fixture.debugElement.nativeElement;
     expect(compiled.querySelector('my-grid')).not.toBe(null);
})

Answer 1

You can use the debugElement to query your component:

Example

const debugElement = fixture.debugElement.query(By.directive(MyGridComponent));
const nativeElement = debugElement.nativeElement;
const component: MyGridComponent = debugElement.componentInstance;