在 Angular 2 单元测试中使用 Http答案

【问题标题】：using Http on angular 2 unit tests在 Angular 2 单元测试中使用 Http
【发布时间】：2016-12-20 08:56:57
【问题描述】：

我正在使用这个种子项目：https://github.com/juliemr/ng2-test-seed，它最近更新到了 Angular 的 RC5。

我想在单元测试中使用 Http 组件，所以我做了以下操作：

在 package.json 我添加了依赖项：

"@angular/http": "2.0.0-rc.5",

在 src/test/user-service_test.ts 我添加了：

import { HttpModule, Http } from '@angular/http';

并修改了 beforeEach 函数以包含 HttpModule：

beforeEach(() => {
    TestBed.configureTestingModule({
      providers: [LoginService, UserService, HttpModule]
    });
  });

现在，当我在 beforeEach 函数中添加 HttpModule 并尝试执行测试时，我得到了这个错误：

13 08 2016 09:13:27.609:WARN [web-server]: 404: /base/node_modules/@angular/http
Missing error handler on `socket`.
TypeError: (msg || "").replace is not a function
    at /home/david/Workspace/ng2-seed/node_modules/karma/lib/reporter.js:45:23
    at onBrowserError (/home/david/Workspace/ng2-seed/node_modules/karma/lib/reporters/base.js:58:60)
    at null.<anonymous> (/home/david/Workspace/ng2-seed/node_modules/karma/lib/events.js:13:22)
    at emitTwo (events.js:87:13)
    at emit (events.js:172:7)
    at onKarmaError (/home/david/Workspace/ng2-seed/node_modules/karma/lib/browser.js:95:13)
    at Socket.<anonymous> (/home/david/Workspace/ng2-seed/node_modules/karma/lib/events.js:13:22)
    at emitOne (events.js:82:20)
    at Socket.emit (events.js:169:7)
    at Socket.onevent (/home/david/Workspace/ng2-seed/node_modules/socket.io/lib/socket.js:335:8)
    at Socket.onpacket (/home/david/Workspace/ng2-seed/node_modules/socket.io/lib/socket.js:295:12)
    at Client.ondecoded (/home/david/Workspace/ng2-seed/node_modules/socket.io/lib/client.js:193:14)
    at Decoder.Emitter.emit (/home/david/Workspace/ng2-seed/node_modules/component-emitter/index.js:134:20)
    at Decoder.add (/home/david/Workspace/ng2-seed/node_modules/socket.io-parser/index.js:247:12)
    at Client.ondata (/home/david/Workspace/ng2-seed/node_modules/socket.io/lib/client.js:175:18)
    at emitOne (events.js:77:13)

我仍然没有在“it”函数中使用 Http 组件，有人知道如何在 Rc5 的单元测试中使用 Http 吗？我需要访问我的服务器服务。

【问题讨论】：

HttpModule 是一个模块，而不是一个提供者，它不应该放在providers 中。你试过imports: [HttpModule], providers: ... 吗？
@estus 您的建议似乎是正确的，您可以将其添加为答案并包括必要的导入语句。

标签： angularjs unit-testing http angular dependency-injection

【解决方案1】：

TestBed.configureTestingModule 期望模块定义对象作为参数。 According to the manual，导入的模块被列为imports属性，应该是

TestBed.configureTestingModule({
  imports: [HttpModule],
  providers: [LoginService, UserService]
});

【讨论】：

您的解决方案是正确的，但在 karma-test-shim.js 中也需要包含 '@angular/http': { main: 'index.js', defaultExtension: 'js' }