如何在测试 angular2 组件时模拟可观察流?

2024-02-09

我正在为 angular2 组件编写测试用例。

我创建了一个使用可观察流的服务,如下所示:

import {Injectable}      from '@angular/core'
import {Subject} from 'rxjs/Subject';
import {User} from './user.model';

@Injectable()
export class UserService {

  selectedUserInstance:User = new User();

  // Observable selectedUser source
  private selectedUserSource = new Subject<User>();

  // Observable selectColumn stream
  selectedUser$ = this.selectedUserSource.asObservable();

  // service command
  selectUser(user:User) {
    this.selectedUserInstance=user;
    this.selectedUserSource.next(user);
  }
}

现在,在我的组件中,我已订阅此流:

getSelectedUser() {
    this.subscriptionUser = this.userService.selectedUser$.subscribe(
      selectedUser => {
        this.selectedUser = selectedUser;
      }
    );
}

现在在我的 spec.ts 文件中,我想将此流模拟为:

spyOn(userService, 'selectedUser$')
        .and.returnValue(Observable.of({
            'name': 'bhushan',
            'desc': 'student'
        }));

但它一直给我以下错误:

错误:spyOn 找不到要监视 selectColumn$() 的对象

有什么办法可以做到这一点吗?

我在这个问题上困惑了很长时间。

有任何输入吗?

thanks


selectedUser$不是一种方法,因此您无法监视它。相反,如果你愿意,你可以将它分配给你的可观察的

rapidColumnService.selectedUser$ = Observable.of({
  'name': 'bhushan',
  'desc': 'student'
})

注意(更新):查看更新的用法of here: 类型“typeof Observable”上不存在属性“of” https://stackoverflow.com/questions/38067580/property-of-does-not-exist-on-type-typeof-observable

但老实说,如果这就是你的完整服务,我不明白你为什么需要嘲笑它。它很简单,使用真正的服务可能不会有什么坏处。如果您使用真正的服务,那么您可以selectUser每当你想向被测组件发出新的东西时。

UPDATE

您还可以做的另一件事是不要使用Observable是使用一个Subject. A Subject也是一个Observable,但它允许您发出值,从而更容易模拟值进行测试。

rapidColumnService.selectedUser$ = new BehaviorSubject<any>();

然后当你想发送一个值时

rapidColumnService.selectedUser$.next({
  'name': 'bhushan',
  'desc': 'student'
});

根据您的组件设置和订阅方式,您可能只想使用简单的Subject而不是“BehaviorSubject”。看这个帖子 https://stackoverflow.com/a/43119768/2587435了解更多信息。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在测试 angular2 组件时模拟可观察流? 的相关文章

随机推荐