如何修复“错误：无法从同步测试中调用 setTimeout”。测试服务时？答案

【问题标题】：How to fix "Error: Cannot call setTimeout from within a sync test." when testing for a service?如何修复“错误：无法从同步测试中调用 setTimeout”。测试服务时？
【发布时间】：2019-11-11 09:19:22
【问题描述】：

我正在尝试使用 Jasmine + Karma 对使用 ngx-socket-io 的非常基本的服务进行单元测试。

我不断收到Error: Cannot call setTimeout from within a sync test.

这是我的服务：

import { Injectable } from '@angular/core';
import { Socket } from 'ngx-socket-io';
import { Message } from 'src/app/models/message';

@Injectable({
  providedIn: 'root'
})
export class MessageService {

  constructor(private socket: Socket) { };

  newMessages(){
    return this.socket.fromEvent<Message>('newMessage');
  }

  newMessage(message: String) {
    this.socket.emit('messageSent', message);
  }
}

这是我的单元测试：

import { TestBed } from '@angular/core/testing';
import { MessageService } from './message.service';
import SocketMock from 'socket.io-mock';
import { WrappedSocket } from 'ngx-socket-io/src/socket-io.service';

describe('MessageService', () => {
  let service: MessageService;
  let socket: WrappedSocket = new WrappedSocket(new SocketMock());
  beforeEach(() => {
    TestBed.configureTestingModule({
      providers :[
        MessageService,
        {provide: WrappedSocket, useValue: socket}
      ]
    });
    service = TestBed.get(MessageService);
  });

  it('should be created', async () => {
    expect(service).toBeTruthy();
  });
});

这是完整的错误输出：

Error: Cannot call setTimeout from within a sync test.
    at SyncTestZoneSpec.onScheduleTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone-testing.js:366:1)
    at ZoneDelegate../node_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:404:1)
    at Zone../node_modules/zone.js/dist/zone.js.Zone.scheduleTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:238:1)
    at Zone../node_modules/zone.js/dist/zone.js.Zone.scheduleMacroTask (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:261:1)
    at scheduleMacroTaskWithCurrentZone (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:1245:1)
    at http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:2317:1
    at proto.<computed> (http://localhost:9876/_karma_webpack_/webpack:/node_modules/zone.js/dist/zone.js:1569:1)
    at Request.create (http://localhost:9876/_karma_webpack_/webpack:/node_modules/engine.io-client/lib/transports/polling-xhr.js:268:1)
    at new Request (http://localhost:9876/_karma_webpack_/webpack:/node_modules/engine.io-client/lib/transports/polling-xhr.js:165:1)
    at XHR.request (http://localhost:9876/_karma_webpack_/webpack:/node_modules/engine.io-client/lib/transports/polling-xhr.js:92:1)

我现在只想测试该服务是否已创建。发生了什么事，我怎样才能通过测试？

【问题讨论】：

标签： unit-testing jasmine angular7 angular-services

【解决方案1】：

尝试使用 async beforeEach。可能从那里调用 setTimeout 。

【讨论】：

【解决方案2】：

检查您的 test.ts 文件。主要是 zone.js 的导入顺序应该是

import 'zone.js/dist/long-stack-trace-zone';
import 'zone.js/dist/proxy';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';
import 'zone.js/dist/async-test';
import 'zone.js/dist/fake-async-test';

参考 - https://github.com/angular/zone.js/issues/1058

【讨论】：