Angular2 Karma测试说"TypeError:this._subscribe不是函数". [英] Angular2 Karma test says "TypeError: this._subscribe is not a function"

问题描述

我有一个到目前为止可以正常工作的Angular 2应用程序.我的GlobalsService.getGlobals()通过我的OptionService.getOptions()获取美国州".我的代码失败的地方是Karma/Jasmine测试.

I have an Angular 2 application that works OK so far. My GlobalsService.getGlobals() fetches "USA States" through my OptionService.getOptions(). Where my code falls down is in Karma / Jasmine testing.

当我在当前测试设置中调用getGlobals()时，出现"this._subscribe不是函数"错误.我发现调试起来很困难，因为谷歌浏览器无法配合.

When I call getGlobals() in my current test setup I get the "this._subscribe is not a function" error. I'm finding it hard to debug this because Google Chrome isn't cooperating.

我的getGlobals()代码已添加调试.我在getOptions()和.subscribe()之间拆分了代码，以查看发生了什么.

My getGlobals() code with debugging added. I split the code between getOptions() and .subscribe() to see what is going on.

public getGlobals(): void {
  let asdf = this.optionService.getOptions();

  console.log("asdf is " + (typeof asdf) + ", asdf.subscribe is: " + asdf.subscribe);
  try {
    asdf.subscribe(
      (options: Option[]) => this.fillOptions(options),
      (error: string) => this.error = error
    );
  } catch(error) {
    console.log("caught error involving asdf, it is: " + error);
    throw error;
  }
}

运行此代码时，我得到:

When I run this code I get:

 LOG: 'asdf is object, asdf.subscribe is: function (observerOrNext, error, complete) {
[1]         var operator = this.operator;
[1]         var sink = toSubscriber_1.toSubscriber(observerOrNext, error, complete);
[1]         if (operator) {
[1]             operator.call(sink, this.source);
[1]         }
[1]         else {
[1]             sink.add(this._subscribe(sink));
[1]         }
[1]         if (sink.syncErrorThrowable) {
[1]             sink.syncErrorThrowable = false;
[1]             if (sink.syncErrorThrown) {
[1]                 throw sink.syncErrorValue;
[1]             }
[1]         }
[1]         return sink;
[1]     }'

您可以从node_modules/rxjs/Observable.js中看到asdf.subscribe的代码.因此，getOptions()的返回值是一个Observable.它具有许多特性，其中包括:

The code of asdf.subscribe is what you see from node_modules/rxjs/Observable.js. So the return from getOptions() is a Observable. Among its many properties it has these features:

_subscribe: Array[4] (each item is an Object of my Option data type)
_proto_: Object
  _subscribe: (subscriber) 
  subscribe: (observer or next, error, complete)

但是，如果我继续执行代码，则会收到错误消息.带有asdf变量"this"的位置是GlobalsService.

But if I let the code continue I get the error. In the place with the asdf variable "this" is GlobalsService.

我嘲笑的OptionService代码是:

My mocked OptionService code is:

@Injectable()
export class MockOptionService {
  constructor() { }

  getOptions(): Observable<Option[]> {
    let options: Option[] = [
      { id: 'IN', name: 'Indiana', topic: Option.TOPIC_STATE },
      { id: 'NJ', name: 'New Jersey', topic: Option.TOPIC_STATE },
      { id: 'CONCERT', name: "Concert", topic: Option.TOPIC_EVENT_TYPE },
      { id: 'NY', name: 'New York', topic: Option.TOPIC_STATE }
    ];
    return Observable.create(options);
  }

}

这是通过以下方式注入的:

This is injected through:

describe('Globals Service', () => {

  beforeEach(() => {

    TestBed.configureTestingModule({
      providers: [
        { provide: OptionService, useClass: MockOptionService },
        { provide: GlobalsService, useClass: GlobalsService }
      ]
    });
[SNIP]

});

正如我所说，在调试Chrome时遇到问题.如果我在调试器中显示Observable.js源并尝试设置断点，则浏览器将为不存在的Observable.ts文件显示空白页.断点在任何地方都不会显示.代码在不存在的Observable.ts:92上停止.

As I said, I'm having trouble with Chrome when debugging this. If I show the Observable.js source in the debugger and try to set a breakpoint the browser displays a blank page for the non-existent Observable.ts file. The breakpoint doesn't show in either place. The code is stopping on the non-existent Observable.ts:92.

那么我的问题是:

1.我可以说服Chrome在Typescript世界中给我一个Java断点吗?

2.创建对象数组然后将其附加到Observable的适当功能是什么?我怀疑Observable.create()是错误的.

谢谢， 杰罗姆.

推荐答案

使用 Observable.of . Observable.create 需要预订功能. Observable.create用于创建自定义逻辑" Observable，而Observable.of只是创建一个基本的Observable，它发出传递给它的值.

Use Observable.of instead. Observable.create expects a subscribe function. Observable.create is meant to be used to create a "custom-logic" Observable, while Observable.of just creates a basic Observable that emits the value that you pass to it.

这篇关于Angular2 Karma测试说"TypeError:this._subscribe不是函数".的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！