angular - Angular e2e - 应该在 h1 标签中呈现标题

Question

我正在开发自己的网站。我是 Angular 的新手，只是根据学习和在线帖子，我开始开发我的网站。在运行测试时，我遇到了获取 h1 标签值的错误。

我开发了路线。AppComponent 加载的路由之一是 HomeComponent，其中 h1 标签可用。

在 app.component.spec.ts 文件中，下面无法获取 h1 的值。

it('should render title in a h1 tag', () => {
const fixture = TestBed.createComponent(AppComponent);
fixture.detectChanges();
const compiled = fixture.debugElement.nativeElement;
expect(compiled.querySelector('h1').textContent).toContain('Welcome to jc-web!');});

谁能建议我如何在上面的代码中从 HomeComponent 获取 h1 值？

感谢你的帮助。

Answer 1

为了访问嵌套在 AppComponent 中的 HomeComponent 中的 h1 值，您需要在 TestBed 中提供实际的 HomeComponent：

TestBed.configureTestingModule({
    declarations: [
        AppComponent,
        HomeComponent
    ]
});

或者提供一个存根版本供您的测试使用。如果您选择提供实际组件，则还必须包括其所有依赖项。在此处的 Angular 文档中有关于如何测试嵌套组件的更详细说明。