Angular2 Testing "名前が見つかりません 'HTMLElement'"

Question

私は既存のプロジェクトにテストを導入しようとしていますが、私はテストを実行することを禁止していると思います。私が手にエラーが.../srcに/アプリ/ dashboard.component.spec.ts（15,13）で

ERRORです。名前を見つけることができません 'のHTMLElement'）

クローム57.0.2987 （マックOS X 10.12.3）は：私はすべて検索しました

import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
import { By } from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 

import { DashboardComponent } from './dashboard.component'; 
import { ExchangeService } from './exchange.service'; 

describe('DashboardComponent (templateUrl)',() => { 

    let comp: DashboardComponent; 
    let fixture: ComponentFixture<DashboardComponent>; 

    let spy: jasmine.Spy; 
    let de: DebugElement; 
    let el: HTMLElement; // how does this work...? 
    let exchangeService: ExchangeService; // the actual injected service 

    const testExchange = 'New York Stock Exchange'; 

    beforeEach(async(() => { 
     TestBed.configureTestingModule({ 
      declarations: [ DashboardComponent ], 
      providers: [ ExchangeService ], 
     }) 
     .compileComponents(); 
    })) 


    beforeEach(() => { 

     fixture = TestBed.createComponent(DashboardComponent); 
     comp = fixture.componentInstance; // DashboardComponent test componentInstance 

     // ClockService actually injected into the component 
     exchangeService = fixture.debugElement.injector.get(ExchangeService); 

     // Setup spy on the `getExchanges` method 
     spy = spyOn(exchangeService, 'getExchanges') 
      .and.returnValue(Promise.resolve(testExchange)); 
     // query for the title <h1> by CSS element selector 

     de = fixture.debugElement.query(By.css('.exchange')); 
     el = de.nativeElement; 
    }); 

    it('should not show exchange before OnInit',() => { 
     expect(el.textContent).toBe('', 'nothing displayed'); 
     expect(spy.calls.any()).toBe(false, 'getExchanges not yet called'); 
    }); 

    it('true is true',() => expect(false).toBe(true)); 
}); 

：実行される4 SUCCESS（7.24秒/ 6.55秒）

マイdashboard.component.spec.tsの4は、このようになりますそのエラーメッセージの周りに、私はそれをどこでも見つけることはできないようだ。また、最後のテストは失敗するはずですが、このエラーのためにコンパイルさえしていないと思います。何が間違っているかの手がかりは？私は最初、それが私が行方不明だった輸入品だと思ったが、誰かがHTMLElementsを輸入するのを見ることができない。ありがとう！

編集：

{ 
    "compileOnSave": false, 
    "compilerOptions": { 
    "outDir": "./dist/out-tsc", 
    "sourceMap": true, 
    "declaration": false, 
    "moduleResolution": "node", 
    "emitDecoratorMetadata": true, 
    "experimentalDecorators": true, 
    "target": "es5", 
    "lib": [ 
     "es6", 
     "dom", 
     "es2015.iterable" 
    ] 
    } 
} 

編集2： 私tsconfig.jsonはこのようになります 私は実際にはCtrl + Cを持っていて、それが正しくコンパイルするためのテストを再起動（私は思いましたそれはファイルの変更時にそれを行うだろうが、それはしませんでした）。ありがとうございました！あなたはLIBアレイへdomライブラリを追加する必要があり、あなたのテストプロジェクトからのごtsconfig.jsonで

Answer 1

：

"lib": ["es6", "dom", "es2015.iterable"], 

Answer 2

私は同じ問題時に継続的なテストではなく、単一の実行としていました。テストでは、最初の実行でコンパイルだろうが、私は任意のコードを変更したときにコンパイルが

Cannot find name 'HTMLElement'

エラーメッセージを表示して停止してしまうような、私はCtr+Cし、再起動しなければなりませんでした。 tsconfig.spec.json変更
PierreDucにより示唆されるように

"lib": ["es6", "dom"],

には、問題を硬化させ、私のテストスイートは、連続モードで実行します。

Answer 3

私もHTMLElementと間違っています。私はHtmlElementでした。お役に立てれば。