跳至主要内容

常见问题解答

有关不特定于 Angular 测试的问题,请参阅主要常见问题解答

我可以用这个库编写单元测试吗?

当然可以!您可以使用此库编写单元测试和集成测试。有关如何模拟依赖项(因为此库有意不支持浅渲染)以进行高级组件的单元测试,请参见以下内容。本项目中的测试展示了使用此库进行单元测试的几个示例。

在编写测试时,请牢记

测试越类似于软件的使用方式,您获得的信心就越高。 - 2018 年 2 月 17 日

如果我不能使用浅渲染,如何在测试中模拟组件?

通常情况下,您应该避免模拟组件(请参见指南原则部分)。但是,如果需要,请尝试使用ng-mocks及其MockBuilder

import {Component, NgModule} from '@angular/core'
import {render, screen} from '@testing-library/angular'
import {MockBuilder} from 'ng-mocks'

@Component({
selector: 'app-parent-component',
template: '<app-child-component></app-child-component>',
})
class ParentComponent {}

@Component({
selector: 'app-child-component',
template: '<p>Child component</p>',
})
class ChildComponent {}

@NgModule({
declarations: [ParentComponent, ChildComponent],
})
export class AppModule {}

describe('ParentComponent', () => {
it('should not render ChildComponent when shallow rendering', async () => {
// all imports, declarations and exports of AppModule will be mocked.
const dependencies = MockBuilder(ParentComponent, AppModule).build()

await render(ParentComponent, dependencies)

expect(screen.queryByText('Child component')).toBeNull()
})
})
我应该测试组件树的哪个级别?子级、父级还是两者?

遵循此库的指导原则,将测试围绕用户体验和与应用程序功能交互的方式而不是围绕特定组件本身进行组织非常有用。例如,对于可重用组件库,在某些情况下可能需要将开发人员包含在用户列表中以对其进行测试,并单独测试每个可重用组件。在其他情况下,组件树的具体细分仅仅是实现细节,单独测试该树中的每个组件可能会导致问题(请参见https://kentcdodds.com/blog/avoid-the-test-user)。

实际上,这意味着最好在组件树中进行足够高的测试以模拟真实的用户交互。关于是否值得在此基础上额外测试更高或更低级别的问题归结为权衡取舍的问题,以及什么方法可以为成本提供足够的价值(请参见https://kentcdodds.com/blog/unit-vs-integration-vs-e2e-tests,了解有关不同测试级别的更多信息)。

有关此主题的更深入讨论,请参见此视频