Sử dụng NgbModule.forRoot() trong thành phần khiến các kiểm tra thất bại

Question

Tôi đang sử dụng Chú giải công cụ và Mô-đun trong thành phần lồng nhau và trong tệp spec của tôi, tôi đang nhập NgbModule.forRoot() trong mô-đun thử nghiệm.

Điều này dường như làm việc ở khắp mọi nơi ngoại trừ trong một thành phần này, và nếu tôi thêm nhập khẩu này, nhiều đơn vị xét nghiệm của tôi đột nhiên bắt đầu thất bại với lỗi này:

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

Tôi đang sử dụng góc CLI cho bundling/thử nghiệm.

Đây là thành phần duy nhất không thực hiện các thử nghiệm của tôi.

Tôi cũng đã cố gắng nhập riêng các mô-đun Tooltip/Modal và các nhà cung cấp có liên quan của riêng họ và tôi vẫn gặp phải lỗi ở trên. Nếu tôi thử nó mà không có forRoot(), tôi nhận được lỗi DI.

Tôi không biết vấn đề là gì.

Dưới đây là file spec:

/* 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(); 
    }); 
}); 

Answer 1

Tôi có một cách giải quyết nhưng tôi nghĩ rằng đây là một vấn đề với NgbTooltip khi chạy trong bộ ghép đo. Thêm dòng sau trên toàn cầu để xác định lại phương pháp ngOnDestroy NgbTooltip của:

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

Dòng thứ ba nhận xét ra dừng các lỗi xuất hiện trong các thử nghiệm đơn vị của tôi. Bit của một hack nhưng nên được ok trong bài kiểm tra đơn vị. Tôi nghĩ rằng chức năng này không được khởi tạo trong ngOnInit() một cách chính xác khi chạy trong một thử nghiệm thử nghiệm.

Tôi đã thử ghi đè chỉ thị NgbTooltip bằng ghi đè() nhưng bản gốc dường như luôn được gọi là bất kể.

Để tìm lỗi thực tế tôi đã thêm dòng sau vào đơn vị của tôi kiểm tra spec:

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

này sau đó hiển thị ngoại trừ thực tế mà dường như xảy ra:

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) 

Answer 2

tôi sẽ đề nghị chỉ để stub nó trong beforeEach:

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