在 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 在這里定義： import { MenuItem } from './../classes/menu-item';

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

這是一個令人討厭的錯誤，我想我會在你的規范中包含另一個微妙的原因。 在我的情況下，我指定了“提供者”而不是“提供”，如下所示

 TestBed.configureTestingModule({
      providers: [{provider: ApplicationActions, useClass: ActionMock}] // don't do that (missing 'provide')!

而不是提供有用的信息，比如“沒有指定‘提供’鍵”，它只是簡單地報告

失敗：NgModule 'DynamicTestModule' 的提供者無效 - 僅允許提供者和類型的實例，得到：[?[object Object]?, ...]

Answer 2

順便說一句，還介意在提供商中使用 class，而不是一些變量。 由於意外的問題更換/外殼，這發生在我身上：

正確的

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

代替...

不正確

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

請注意，如果您在測試中使用駝峰命名法變量 ( someService )，則它可能存在，這就是它不會引發語法錯誤的原因。

Answer 3

我有同樣的問題，在我的Ionic Framework項目中導入時是這樣的：

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

而不是：

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

Answer 4

就我而言，我的提供程序行中有一個雜散逗號，導致DynamicTestModule認為我傳遞了一個undefined定義。

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