2017-02-15 1 views
6

중첩 구성 요소에서 툴팁 및 모달을 사용하고 있으며, 사양 파일에서 테스트 모듈에 NgbModule.forRoot()을 가져옵니다.테스트를 실패하게하는 구성 요소에서 NgbModule.forRoot()를 사용합니다.

이이 하나 개의 구성 요소를 제외하고 모든 곳에서 작동하는 것 같다, 나는이 가져 오기를 추가하면, 내 단위 테스트의 많은 갑자기이 오류와 함께 실패 시작 :

TypeError: this._unregisterListenersFn is not a function 
     at NgbTooltip.ngOnDestroy 

을 내가 번들에 대한 각도 CLI를 사용하고 있습니다/테스트.

이것은 내 테스트에 실패한 유일한 구성 요소입니다.

또한 툴팁/모달 모듈을 개별적으로 가져와 해당 관련 제공 업체를 별도로 가져 오려고 시도했지만 위의 오류가 계속 발생합니다. forRoot()없이 시도하면 DI 오류가 발생합니다.

나는 문제가 무엇인지 전혀 모른다.

다음은 스펙 파일입니다 :

/* tslint:disable:no-unused-variable */ 
import { async, ComponentFixture, TestBed } from '@angular/core/testing'; 
import { By } from '@angular/platform-browser'; 
import { DebugElement } from '@angular/core'; 
import { APP_BASE_HREF } from '@angular/common'; 
import { RouterTestingModule } from '@angular/router/testing'; 
import { NgbModule, NgbTooltipModule, NgbTooltipConfig, NgbModalModule } from '@ng-bootstrap/ng-bootstrap'; 
import { NgbModalStack } from '@ng-bootstrap/ng-bootstrap/modal/modal-stack'; 

import { ListItemComponent } from './list-item.component'; 
import { VideoPlayerService } from '../../../video-player'; 
import { CalendarRoutingService } from '../../calendar-routing.service'; 

describe('ListItemComponent',() => { 
    let component: ListItemComponent; 
    let fixture: ComponentFixture<ListItemComponent>; 

    beforeEach(async(() => { 
    TestBed.configureTestingModule({ 
     declarations: [ 
     ListItemComponent 
     ], 
     imports: [RouterTestingModule, NgbModule.forRoot()], 
     providers: [ 
     VideoPlayerService, 
     CalendarRoutingService, 
     // NgbModalStack, 
     // NgbTooltipConfig 
     ] 
    }) 
    .compileComponents(); 
    })); 

    beforeEach(() => { 
    fixture = TestBed.createComponent(ListItemComponent); 
    component = fixture.componentInstance; 
    component.item = { records: [] }; 
    fixture.detectChanges(); 
    }); 

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

답변

1

내가 해결을해야하지만 테스트 픽스처 내에서 실행할 때이 NgbTooltip의 문제라고 생각합니다. NgbTooltip의 ngOnDestroy 방법을 재정의 세계적으로 다음을 추가합니다

NgbTooltip.prototype.ngOnDestroy = function() { 
    this.close(); 
    //this._unregisterListenersFn(); 
    this._zoneSubscription.unsubscribe(); 
}; 

주석 세 번째 줄은 내 단위 테스트에 나타나는 오류를 중지합니다. 해킹 비트이지만 유닛 테스트에서는 괜찮을 것입니다. 나는이 기능이 ngOnInit()에서 정확하게 초기화되지 않았다고 생각한다.

NgbTooltip 지시문을 overrideDirective()로 재정의하려고했지만 원본은 항상 관계없이 호출되는 것처럼 보였습니다.

TypeError: this._unregisterListenersFn is not a function 
at NgbTooltip.webpackJsonp.../../../../@ng-bootstrap/ng-bootstrap/tooltip/tooltip.js.NgbTooltip.ngOnDestroy (http://localhost:9876/_karma_webpack_/vendor.bundle.js:4522:14) 
at callProviderLifecycles (http://localhost:9876/_karma_webpack_/vendor.bundle.js:103669:18) 
at callElementProvidersLifecycles (http://localhost:9876/_karma_webpack_/vendor.bundle.js:103638:13) 
at callLifecycleHooksChildrenFirst (http://localhost:9876/_karma_webpack_/vendor.bundle.js:103622:17) 
at destroyView (http://localhost:9876/_karma_webpack_/vendor.bundle.js:104948:5) 
at callViewAction (http://localhost:9876/_karma_webpack_/vendor.bundle.js:105094:13) 
at execComponentViewsAction (http://localhost:9876/_karma_webpack_/vendor.bundle.js:105006:13) 
at destroyView (http://localhost:9876/_karma_webpack_/vendor.bundle.js:104947:5) 
at callViewAction (http://localhost:9876/_karma_webpack_/vendor.bundle.js:105094:13) 
at execComponentViewsAction (http://localhost:9876/_karma_webpack_/vendor.bundle.js:105006:13) 
1

난 그냥에 제안 :

afterEach(() => { 
    fixture.destroy(); 
}); 

이 후 발생하는 것 같았다 실제 예외를 표시 :

는 실제 오류를 찾기 위해 나는 내 단위 테스트 사양에 다음 추가 이전에 스텁하기 :

// fix 'Error during cleanup of component' 
NgbTooltip.prototype.ngOnDestroy = jasmine.createSpy('ngOnDestroy'); 
(NgbTooltip.prototype.ngOnDestroy as jasmine.Spy).and.stub(); 
관련 문제