无法读取Angular Test Mock的属性’subscribe’

发布时间：2020-12-17 10:24:46 所属栏目：安全来源：网络整理

导读：我正在尝试对具有注入服务的Angular组件进行单元测试.在组件的构造函数中,调用注入服务的方法,该方法返回Observable.我正在尝试在组件的单??元测试中模拟服务,但我一直遇到这个错误：TypeError：无法读取undefined的属性’subscribe’. 我试图通过以下方式模

我正在尝试对具有注入服务的Angular组件进行单元测试.在组件的构造函数中,调用注入服务的方法,该方法返回Observable.我正在尝试在组件的单??元测试中模拟服务,但我一直遇到这个错误：TypeError：无法读取undefined的属性’subscribe’.

我试图通过以下方式模拟服务：

const serviceStub = {
  getObservable: () => { return {subscribe: () => {}}; },};

beforeEach(async(() => {
  TestBed.configureTestingModule({
    providers: [
      {provide: MyService,useValue: serviceStub}
    ]
})


it('should create',() => {
  spyOn(serviceStub,'getObservable').and.returnValue({subscribe: () => {}});
  expect(component).toBeTruthy();
});

感觉我错过了一些明显的东西.有人可以指出来吗？

UPDATE

即使我在我的测试床提供商中注入实际服务,我也会收到此错误.

组件的构造函数看起来像这样：

private _subscription: Subscription;

constructor(private _service: MyService) {
  this._subscription = _service.getObservable().subscribe(console.log);
}

使用inject注入服务并模拟它而不是存根

it('should create',inject([MyService],(myService: MyService) => {
  spyOn(myService,'getObservable').and.returnValue({subscribe: () => {}});
  expect(component).toBeTruthy();
}));

这是完整版：

零件：

@Component({
  selector: 'my-cmp',template: 'my cmp {{x}}'
})
export class MyComponent {
  x;

  constructor(private myService: MyService) {
    this.myService.getObservable()
      .subscribe(x => {
        console.log(x);
        this.x = x;
      });
  }
}

测试：

describe('my component test',() => {
    let fixture: ComponentFixture<MyComponent>,comp: MyComponent,debugElement: DebugElement,element: HTMLElement;

    beforeEach(async(() => {
      TestBed.configureTestingModule({
        declarations: [MyComponent],providers: [MyService]
      });
    }));

    beforeEach(() => {
      fixture = TestBed.createComponent(MyComponent);
      comp = fixture.componentInstance;
      debugElement = fixture.debugElement;
      element = debugElement.nativeElement;
    });

    it('should create',(myService: MyService) => {
      expect(comp).toBeTruthy();
    }));

    it('should set value',async(inject([MyService],(myService: MyService) => {
      spyOn(myService,'getObservable').and.returnValue(Observable.of(1));

      fixture.detectChanges();

      fixture.whenStable().then(() => {
        expect(comp.x).toEqual(1);
      });
    })));
  });

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!