角2 - テストのために別のモジュールの依存関係を上書きする方法

Question

モジュール内のサービスを別のモジュールのサービスに依存してテストしようとしています。他のモジュールのサービス、コンポーネント...はnpmパッケージを介してアクセスされます。私の会社は、ほとんどがソースコードをウェブに載せることに少し厄介なので、うまくいけば私は助けを得るために十分に投稿しました。

私が募集したいサービスは、ユーザー情報を取得し、別のモジュールに存在します。このサービスによって返されるプロパティが定義されていないというエラーが表示されます。 TestBed.overrideModuleを使用して、他のモジュールのプロバイダを作成したモックバージョンに変更しようとしました。私はoverrideModuleのドキュメンテーションを見つけるのに困っています。私は数日間試してみましたが、overrideModulesのいくつかの使用法を見つけても、私が仕事をしたいと思うようにする方法を理解することはできません。どんな助けもありがとう。

エラーが発生したため、正しい依存関係が注入されているかどうかは疑問ですが、実際の確認方法はわかりません。エラースタックのトレースは、webpack：///node_modules/@another-repo/prefs/index.jsに相当します。

コード（あなたは私が私の会社を同定するもの取り除くしようとした質問がある場合は私に知らせてください）：私のモジュールに

次のものがあり、これはである

// classa.service.ts 
import { Injectable } from '@angular/core'; 
import { IDModel } from '@another-repo/core'; 
import { FormatService } from '@another-repo/prefs'; 
import { MyRepo } from './my-repo.service'; 

@Injectable() 
export class ClassA { 
    constructor(idModel: IDModel, repo: MyRepo, formats: FormatService) { 

    } 
    doSomething() { } 
} 
// in my module 
// my-repo.service.ts 
import { Injectable } from '@angular/core'; 
import { Http, Response } from '@angular/http'; 

@Injectable() 
export class MyRepo { 
    constructor(private readonly http: Http) { 
    } 

    get(id): Observable<any> { 
     return this.http 
      .get(api(`${id}`)) 
      .map(response => response.json()); 
    } 
} 

// my-repo-service.spec.ts 
//... 
describe('test',() => { 
    let testService; 
    beforeEach(async() => { 
     TestBed.configureTestingModule({ 
      imports: [ 
       HttpModule, 
       FooModule 
      ], 
      providers: [ 
       { provide: RepoToMock1, useClass: MockRepoToMock1 }, 
       MyRepo, 
      ], 
     }); 

     TestBed.overrideModule(FooModule, 
      { 
       remove: { 
        providers: [RepoToMock1] 
       }, 
       add: { 
        providers: [{ provide: RepoToMock1, useClass: MockRepoToMock1 }] 
       } 
      }); 
    }); 

    beforeEach(() => { 
     testService = TestBed.get(MyRepo); 
    }); 
    //... 
}); 

node_moduleのindex.d.tsファイルは、モジュールFooModuleを呼び出します。

export class IDModel { 
    id: Observable<number>; 
    constructor(otherIdRepo: OtherIdRepo, otherType: OtherTypeModel); 
} 

export class FormatService { 
    constructor(formatModel: FormatModel, timeService: TimeService, numberService, NumberService); 
} 

export class FormatModel { 
    myFormat: Format; 
    constructor(repo: RepoToMock1); 
} 

export class Format { 
    branding: string; 
} 

export class RepoToMock1 { 
    constructor(http: Http); 
    getPrefs(): Observable<Format>; 
} 

export class TimeService { 
    constructor(formatModel: FormatModel); 
} 

export class NumberService { 
    getNumber(); 
} 

Answer 1

私はuseFactoryを使用します。以下のコードを参照してください。

私はテストで、すべての依存関係を注入用に嘲笑しなければならないことを発見しました。これは、コードベースを切り離し、注射可能物に依存する項目の検査に影響を与えることなく、注射可能物への更新を可能にする。

たとえば、YコンポーネントのテストにXサービスを組み込み、それを嘲笑せずにXサービスにlodashを使用する必要があるという新しい機能が必要と判断したとします。あなたが新しい依存関係を導入し、それを説明しなかったので、コンポーネントYのテストはすべて失敗に終わります。コンポーネントYのテストは、新しいlodash依存関数を使用するかどうかにかかわらず失敗します。

コンポーネントYテストでサービスXが疑似化された場合、コンポーネントYテストに影響を与えずにサービスXに変更を加えることができます。

//y.component.spec.ts 
describe('YComponent',() => { 

    let component: YComponent; 
    let fixture: ComponentFixture<YComponent>; 
    let xService: XService; 

    beforeEach(async(() => { 
    let mockXService = { 
     getTextColor:() => {} 
    }; 

    TestBed.configureTestingModule({ 
     declarations: [ 
     YComponent, 
     ], 
     imports: [ 
     FormsModule 
     ], 
     providers: [ 
     {provide: XService, useFactory:() => { return mockXService; }} 
     ], 
     schemas: [CUSTOM_ELEMENTS_SCHEMA] 
    }).compileComponents(); 

    fixture = TestBed.createComponent(YComponent); 
    component = fixture.componentInstance; 
    roomingService = TestBed.get(XService); 

    fixture.detectChanges(); 
    })); 

    it('should create', async(() => { 
    // Assert 
    expect(component).toBeTruthy(); 
    })); 

});