Angular 6中的服务测试-MockBackend

时间:2018-08-03 21:10:04

标签: angular testing angular-services

我正在尝试测试服务中返回一个可观察值(BehaviorSubject)的函数。

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { BehaviorSubject, Observable } from 'rxjs';

@Injectable({
  providedIn: 'root'
})
export class TopicsService {
  private topics = [];
  private obs = new BehaviorSubject<any>(this.topics);

  constructor(private http: HttpClient) {}

  getTopics(): BehaviorSubject<any> {
    if (!this.topics.length) {
      this.http.get('http://localhost:8089/topics')
        .subscribe(
          (topicsData: any) => {
            this.topics = topicsData;
            this.obs.next(this.topics);
          }
        );
    }

    return this.obs;
  }

然后,我创建了一个我希望在Http伪调用中接收到的mockResponse对象。 然后,我调用getTopics()函数,并订阅了Observable,我希望所得到的实际上是响应的主体:

import { TestBed, inject } from '@angular/core/testing';
import { HttpClient, HttpHandler } from '@angular/common/http';
import { ConnectionBackend, ResponseOptions } from '@angular/http';
import { MockBackend } from '@angular/http/testing';

import { TopicsService } from './topics.service';

describe('TopicsService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [
        TopicsService, HttpClient, HttpHandler,
        { provide: ConnectionBackend, useClass: MockBackend }
       ]
    });
  });

  describe('#getTopics()', () => {
    it('should be created', inject([TopicsService], (service: TopicsService) => {
      expect(service).toBeTruthy();
    }));

    it('should return a BehaviourSubject<any<Topic>>',
      inject([TopicsService, ConnectionBackend], (service: TopicsService, mockBackend) => {

      const mockResponse = {
          name: 'Chess',
          decription: 'Best chess courses'
      };

      mockBackend.connections.subscribe((connection) => {
        connection.mockRespond(new Response(new ResponseOptions({
          body: JSON.stringify(mockResponse)
        })));
      });

      service.getTopics().subscribe((topicData) => {
        expect(topicData.length).toBe(1);
        expect(topicData.name).toEqual('Chess');
        expect(topicData.description).toEqual('Best chess courses');
      });
    }));
  });
});

我显然做错了,但似乎无法理解。提前非常感谢!

编辑:对不起,我忘了添加测试输出,这很不好:

TopicsService #getTopics() should return a BehaviourSubject<any<Topic>> FAILED
        Expected 0 to be 1.
            at SafeSubscriber._next src/services/topics.service.spec.ts:38:34)
            at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub node_modules/rxjs/_esm5/internal/Subscriber.js:195:1)
            at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next node_modules/rxjs/_esm5/internal/Subscriber.js:133:1)
            at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next node_modules/rxjs/_esm5/internal/Subscriber.js:77:1)
        Expected undefined to equal 'Chess'.
            at SafeSubscriber._next src/services/topics.service.spec.ts:39:32)
            at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub node_modules/rxjs/_esm5/internal/Subscriber.js:195:1)
            at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next node_modules/rxjs/_esm5/internal/Subscriber.js:133:1)
            at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next node_modules/rxjs/_esm5/internal/Subscriber.js:77:1)
        Expected undefined to equal 'Best chess courses'.
            at SafeSubscriber._next src/services/topics.service.spec.ts:40:39)
            at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub node_modules/rxjs/_esm5/internal/Subscriber.js:195:1)
            at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next node_modules/rxjs/_esm5/internal/Subscriber.js:133:1)

0 个答案:

没有答案