0

你能告诉我为什么我收到这个错误无法读取未定义的属性'getData' 我正在尝试测试我的服务当我尝试运行我的测试时它给了我上面的错误这是我的代码 https://stackblitz.com/编辑/角度测试-w9towo?file=app%2Fapp.service.spec.ts

     import { TestBed, ComponentFixture, async, inject } from '@angular/core/testing';
import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
import {Posts} from './post.interface';

import { AppService } from './app.service';

describe('AppService', () => {
  let service:AppService,
  httpMock:HttpTestingController;
  beforeEach(() => {
    beforeEach(async(() => {
      TestBed.configureTestingModule({
       imports: [HttpClientTestingModule],
        providers: [AppService]

      }).compileComponents();
      service =TestBed.get(AppService);
      httpMock =TestBed.get(HttpTestingController);

    }));

    afterEach(()=>{
     httpMock.verify();
    })
  })


  describe('Service is truty', () => {
       it('should return an Observable<User[]>', () => {
      const dummyUsers :Posts[]= [{
        userId: 10,
        id: 10,
        title: 'post',
        body: 'post'
      }];

      service.getData().subscribe(users => {
        console.log(users)
        expect(users.length).toBe(1);
        expect(users).toEqual(dummyUsers);
      });

      const req= httpMock.expectOne('https://jsonplaceholder.typicode.com/posts')
          expect(req.method).toBe('GET');
  req.flush(dummyUsers);
    });

  })
})

尝试更多后，我得到无法读取未定义的属性“getData”

在此处输入图像描述

4

2 回答 2

1

为什么要使用嵌套beforeEach()and compileComponents()？您的beforeEach()声明应如下所示：

beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [HttpClientTestingModule],
      providers: [AppService]
    });

    service = TestBed.get(AppService);
    httpMock = TestBed.get(HttpTestingController);
  });
于 2018-04-16T02:06:51.550 回答
0

尝试这个：

import { TestBed, ComponentFixture, async, inject } from '@angular/core/testing';
import {HttpClientTestingModule, HttpTestingController} from '@angular/common/http/testing';
import {Posts} from './post.interface';
import {HttpModule} from '@angular/http';

import { AppService } from './app.service';

describe('AppService', () => {
  let service:AppService,
  httpMock:HttpTestingController;
  let fixture;


    beforeEach(async(() => {
      TestBed.configureTestingModule({
      imports: [HttpClientTestingModule,
      HttpModule],
        providers: [
          AppService
        ]

      }).compileComponents().then( () => {
        service = TestBed.get(AppService);
        httpMock =TestBed.get(HttpTestingController);
      })

    }));

    afterEach(()=>{
      httpMock.verify();
    })

  describe('Service is truty', () => {
      it('should return an Observable<User[]>', () => {
      const dummyUsers :Posts[]= [{
        userId: 10,
        id: 10,
        title: 'post',
        body: 'post'
      }];

      service.getData().subscribe(users => {
      console.log(users)
        expect(users.length).toBe(1);
        expect(users).toEqual(dummyUsers);
      });

      const req= httpMock.expectOne('https://jsonplaceholder.typicode.com/posts')
          //expect(req.method).toBe('GET');
  req.flush(dummyUsers);
    });

  })
})

现场演示：

https://stackblitz.com/edit/angular-testing-oqrffm?file=app%2Fapp.service.spec.ts

于 2018-04-16T02:21:45.653 回答