使用路由器测试子组件的内容

Question

嗨，我想从子组件的h1检查渲染。我想获得null标签时有一个h1。

我的测试：

fdescribe('AppComponent', () => {
  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ AppComponent,
        MenuComponent,
        UsersComponent,
        HomeComponent,
        AddUserComponent ],
      imports: [ReactiveFormsModule, HttpClientModule, 
      RouterModule.forRoot(ROUTES)],
      providers: [{provide: APP_BASE_HREF, useValue : '/' }]
  }).compileComponents();
}));

it('should render title in a h1 tag', async(() => {
  const fixture = TestBed.createComponent(AppComponent);
  fixture.detectChanges();
  const compiled = fixture.debugElement.nativeElement;
  console.error("COMPILED -> ", compiled.querySelector('h1'));
  expect(compiled.querySelector('h1').textContent).toContain('Content');
}));
});

我的路由器：

export const ROUTES: Routes = [
  { path: '', component: HomeComponent },
  { path: 'users', component: UsersComponent },
  { path: 'adduser', component: AddUserComponent }
];

我的appComponent.html：

<pr-menu></pr-menu>
<div class="container">
  <router-outlet></router-outlet>
</div>

我的home.component.html

<div class="container" style="text-align:  center">
   <h1>Content</h1>
</div>