2の角度 - その中にサブコンポーネントを持つコンポーネントでいくつかのテストをしようとinjectionToken依存

Question

イムとモックコンポーネント：

これは、親コンポーネントのテンプレートです：

<header></header> 
<snackbar></snackbar> 

このスナックバーコンポーネントがあります親コンポーネントをテストしようとすると問題が起こります。snackbarコンポーネントは、コンポーネントに必要なappConfig（いくつかの定数）をコンポーネントに渡すために使用される、injectionTokenとの依存関係があります。 AppConfigは、このようなスナックバーコンポーネントに注入されています

import { APP_CONFIG, AppConfig } from '../../../../app.config'; 

export class SnackbarComponent implements OnInit { 

    private config: MdSnackBarConfig; 

    constructor(
    @Inject(APP_CONFIG) config: AppConfig 
) { 
    let snackBarConfig = new MdSnackBarConfig(); 
    this.config = snackBarConfig; 
    } 
} 

良い親コンポーネント・テストが、それはinjectionToken依存性のためのプロバイダを見つけることが、そのことはできませんので、失敗したスナックバーコンポーネントの依存関係を解決しようとするとき。

私は、この問題を解決する適切な方法は、snackbarコンポーネントをモックすることだと思います。

ご協力いただければ幸いです。このため、プロバイダを追加するためにAngular tutorial:

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

export interface IAppConfig { 
    smartTable: { 
    widthColumnNumber: string; 
    widthColumnPercentage: string; 
    }; 
} 

export const APP_DI_CONFIG: IAppConfig = { 
    smartTable: { 
    widthColumnNumber: '5rem', 
    widthColumnPercentage: '10rem', 
    }, 
}; 

export let APP_CONFIG = new InjectionToken<IAppConfig>('app.config'); 

で説明したように感謝

Answer 1

私はあなたのApp.configファイルは次のようになります推測、あなたはこのようにNgModuleにプロバイダを追加する必要があります

import { APP_CONFIG, APP_DI_CONFIG } from '../../app.config'; 

... 
... 

{ provide: APP_CONFIG, useValue: APP_DI_CONFIG }, 

そして、あなたのユニットテストであなたが設定を模擬するために、これを行うことができます：

import { APP_CONFIG } from '../../app.config'; 

... 
let mockConfig = {}; 
... 

{ provide: APP_CONFIG, useValue: mockConfig },