在 Angular 2 中测试服务时，NgModule“DynamicTestModule”的提供程序无效

Question

我有以下服务：

import { Injectable } from '@angular/core';

import { MenuItem } from './../classes/menu-item';
import { ITEMS } from './../static-data/items-list';

@Injectable()
export class ItemsListService {

    getItems(): Promise<MenuItem[]> {
        return Promise.resolve(ITEMS);
    }

}

此服务的测试在这里：

import { TestBed, async, inject } from '@angular/core/testing';

import { ItemListService } from './item-list.service';
import { MenuItem } from './../classes/menu-item';
import { ITEMS } from './../static-data/items-list';

describe('ItemListService', () => {
  beforeEach(() => {
    TestBed.configureTestingModule({
        providers: [ ItemListService, MenuItem, ITEMS ]
    });
  });

  it('should ...', inject([ItemListService], (service: ItemListService) => {
    expect(service).toBeTruthy();
  }));
});

MenuItem 在这里定义：

export class MenuItem {
    name: string;
    link: string;
}

ITEMS 定义如下： 从 './../classes/menu-item' 导入 { MenuItem };

export var ITEMS: MenuItem[] = [
    {name: 'Vehicles', link: '/vehicles'},
    {name: 'Gateways', link: '/gateways'},
    {name: 'Statuses', link: '/statuses'},
    {name: 'Logs', link: '/logs'}
]

当我运行测试时，我在浏览器控制台中出现以下错误：

FAILED ItemListService should ...

和

那么为什么我会出现这些错误呢？测试成功的解决方案是什么？

Answer 1

这是一个非常烦人的错误，我想我会在你的规范中包含另一个微妙的原因来查找。就我而言，我指定了

providers

而不是正确的

provide

值，如下所示

 TestBed.configureTestingModule({
      providers: [{provider: ApplicationActions, useClass: ActionMock}]

它只是报告，而不是提供诸如“未指定‘提供’密钥”之类的有用信息

失败：NgModule“DynamicTestModule”的提供程序无效 - 仅 允许 Provider 和 Type 的实例，得到：[?[object Object]?, ...]

Answer 2

顺便说一句，也介意在提供者中使用类，而不是某些变量。由于意外更换/外壳出现问题，我发生了这种情况：

正确

 TestBed.configureTestingModule({
    // ...
    providers: [ SomeService ]
}

而不是...

不正确

 TestBed.configureTestingModule({
    // ...
    providers: [ someService ]
}

请注意，如果您在测试中使用camelCase变量（

someService

），那么它很可能存在，这就是为什么它不会抛出语法错误。

Answer 3

就我而言，我的提供者行之一中有一个杂散逗号，导致

DynamicTestModule

认为我已经通过了

undefined

定义。

        {
          provide: ApiService,
          useValue: {
            getUsers: jasmine
              .createSpy('getUsers')
              .and.returnValue(of({ status: 200, body: [] })),
          },
        },
        , // whoops!
        MessageService,
        { provide: Location, useValue: { back: jasmine.createSpy('back') } },

Answer 4

我收到此错误，因为提供者数组中存在额外的逗号。

Answer 5

这是因为providers [..]数组中使用了camelCase。

正确做法：

beforeEach(() => {
        providers: [**TestService**, ...]
    }
);

Answer 6

我有同样的问题，当导入我的

Ionic Framework

项目时，如下所示：

import {Device} from '@ionic-native/device'

而不是：

import {Device} from '@ionic-native/device/ngx'