Question

我刚刚开始一项新工作，而我的第一个项目是在Angular Web应用程序上工作。这是我第一次使用Angular，因此我仍在学习基础知识。

我遇到的困难是调整现有的component.spec.ts文件以适应我在关联的component.ts文件中进行的某些更改。

我相当确定我的更改可以正常工作，但是最终的单元测试管道失败，因为我认为需要更改规范文件以反映我的新代码。我已经尝试过使用Angular的测试文档，但是这并没有帮助我取得进步。

我不能真正显示我的代码，因为它是专有的。我也没有对Angular的理解水平，无法将其变成一个模拟示例。但是也许我可以抽象一些组件，并且您可以给我任何可能的指导。

如果我将现有的component.ts文件编辑为现在具有

@Input() user: User;在导出类别区域中，以及添加了一个功能

ngOnInit() {
     this.client = this.allClients[0].client;
     this.setClient(this.client);
   }

我的规范文件将如何更改以适应更改？

现在，所有6个单元测试均失败，并显示错误消息：

TypeError: Cannot read property '0' of undefined大概是因为我正在访问'user'的属性，而以前根本不需要user。

我事先表示歉意，因为如果不看完整的代码，这可能很难进行建设性，但是任何指导或资源都将受到高度赞赏。

Answer 1

欢迎！

首先，您需要模拟'allClients'数组并返回所需的任何数据。

allClients可能看起来像这样：

mockAllClients: [
    mockData: 0,
    client: 'John Smith'
]

然后，在beforeEach（）函数中，调用spyOn（）函数以从任何获取数据的地方返回模拟数据（我假设您是从HTTP调用中获取或将其传递到组件中的）。

例如（假设您要从服务器请求数据）：

spyOn(someService, 'someEndpoint').and.returnValue(allClients[])

此操作现在将在每次测试之前运行，有效地处理了在每次测试之前运行的ngOninit中所需的数据。

一旦了解了这一点，就可以单独测试setClient（）方法，或者简单地使用上面的spyOn（）方法模拟响应。