如何在 Angular 2+ 中模拟 @select？

Question

谈到 Angular 中的测试，可以在 Google、Stack Overflow 等网站上找到很多方法。我按照这个教程（链接）清晰地区分了单元测试和集成测试。在没有 TestBed 的情况下编写单元测试效果非常好，但是当我需要模拟 @select 属性从 Redux Store 获取数据时就无法直接将 Observable 分配给 @select 属性。有没有办法在不使用 TestBed 的情况下进行模拟？我只想测试组件的纯函数而不是存储、服务或其他依赖项。因此，我没有使用 TestBed 并且实例化了组件对象本身。

- Michael L.

Answer 1

这对你来说需要更多的工作，但是我建议将你的@select()移到一个服务中。这样你可以在组件测试中模拟整个服务，并避免你的组件与redux存储过于紧密耦合。

比如，不要这样写：

class MyComponent {
  ...
  @select(someSelector) someString: Observable<string>;
  ...
}

做：

class MyStoreService {
  ...
  @select(someSelector) someString: Observable<string>;
  ...
}

class MyComponent {
  ...
  constructor(storeService: MyStoreService) {}
  ...
  doSomething(): Observable<string> {
    return this.storeService.someString;
  }
  ...
}

- Jamie Hale