TestBed：モジュール経由でコンポーネントをインポートしたときにコンポーネントがコンパイルされない

Question

現在、html内に別のコンポーネントタグを使用するコンポーネントのユニットテストセットを作成しようとしています。

<bm-panel [title]="title" [panelType]="panelType" [icon]="icon" 
    class="bm-assignment-form-panel"> 
    <div *ngIf="isLoading" class="bm-loader"><img src="../../../assets/animal.gif"></div> 
    <div class="container-fluid w-100 m-0 p-0"> 
     <!-- Content --> 
    </div> 
</bm-panel> 

しかし、私は、この他のコンポーネントをコンパイルすることができませんでし思えます。私はNO_ERROR_SCHEMA、1-3 beforeEach'esを使っていくつかのアプローチを試みました。働いている唯一の方法は、これは本当にベストプラクティスの方法のように感じることはありません。この

import {...} 

export function main() { 
    describe('AssignmentFormComponent',() => { 
    let comp: AssignmentFormComponent; 
    let fixture: ComponentFixture<AssignmentFormComponent>; 
    let de: DebugElement; 
    let el: HTMLElement; 

    beforeEach(() => { 
     TestBed.configureTestingModule({ 
     imports: [ AssignmentFormModule ] 
     }); 
    }); 

    describe('should build with no problems',() => { 
     it('should be defined',() => { 
     TestBed.compileComponents().then(() => { 
      fixture = TestBed.createComponent(AssignmentFormComponent); 
      comp = fixture.componentInstance; 
      expect(comp).toBeDefined(); 
     }); 

     }); 
    }); 
    }); 
} 

のように見え、やや各ブロックの前の目的に反し。私はそれを模倣する方法を見てみましたが、オーバーライドコンポーネント機能がどのように機能するか、または一般的なジャスミンでどのように動作するかを説明するリソースは見つかりません。

rangle.ioからのビデオのカップルを見ると、彼らはこのような彼らのbeforeEachブロックを書いた：

beforeEach(async() => { 
     TestBed.configureTestingModule({ 
     imports: [ AssignmentFormModule ] 
     }); 
    }); 

    beforeEach(async() => { 
     TestBed.compileComponents(); 
    }); 

    beforeEach(() => { 
     fixture = TestBed.createComponent(AssignmentFormComponent); 
     comp = fixture.componentInstance; 
    }); 
    it('should be defined',() => { 
     expect(comp).toBeDefined(); 
    }); 

これはBM-パネル部品のTemplateUrlのコンパイルに失敗しました。また、モジュールではなくコンポーネントを直接宣言しようとしましたが、効果はありません。

PanelContainerComponent（bm-panel）は、AssignmentFormModule内のモジュールを通じてインポートされますが、コンパイルコンポーネントはコンパイルできませんか？

overrideComponentが可能な解決策であれば、どのように使用するのか気になる人はいらっしゃいますか？

should display TestTitle 
     Chrome 56.0.2924 (Windows 10 0.0.0) 
     Error: This test module uses the component PanelContainerComponent which is using a "templateUrl" or "styleUrls", but they were never compiled. Plea 
se call "TestBed.compileComponents" before your test. 
      at TestBed._initIfNeeded (node_modules/@angular/core/bundles/core-testing.umd.js:774:31) [ProxyZone] 
      at TestBed.createComponent (node_modules/@angular/core/bundles/core-testing.umd.js:853:18) [ProxyZone] 
      at Function.TestBed.createComponent (node_modules/@angular/core/bundles/core-testing.umd.js:682:33) [ProxyZone] 
      at Object.eval (dist/dev/app/bachelor-manager/panels/assignment-form/assignment-form.component.spec.js:62:41) [ProxyZone] 
      at ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/proxy.js:79:39) [ProxyZone] 
      at Zone.run (node_modules/zone.js/dist/zone.js:126:43) [<root> => ProxyZone] 
      at Object.<anonymous> (node_modules/zone.js/dist/jasmine-patch.js:102:34) [<root>] 
      at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (node_modules/zone.js/dist/jasmine-patch.js:132:42) [<root>] 
      at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (node_modules/zone.js/dist/jasmine-patch.js:132:42) [<root>] 
      at ZoneQueueRunner.jasmine.QueueRunner.ZoneQueueRunner.execute (node_modules/zone.js/dist/jasmine-patch.js:132:42) [<root>] 
      at Zone.runTask (node_modules/zone.js/dist/zone.js:166:47) [<root> => <root>] 
      at drainMicroTaskQueue (node_modules/zone.js/dist/zone.js:529:35) [<root>] 
      at ZoneTask.invoke (node_modules/zone.js/dist/zone.js:420:25) [<root>] 
      at data.args.(anonymous function) (node_modules/zone.js/dist/zone.js:1527:25) [<root>] 

Answer 1

回答が見つかりました。誤って非同期機能をasync(()=>{})の代わりに
async() => {}と書きました。

「rxjs/scheduler/async」のasync関数を使用しようとしていたようですので、私を呼び出さないでください。