加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

angular – 在组件中使用NgbModule.forRoot()导致测试失败

发布时间:2020-12-17 07:01:58 所属栏目:安全 来源:网络整理
导读:我在嵌套组件中使用工具提示和模态,在我的spec文件中,我在测试模块中导入NgbModule.forRoot(). 除了在这个组件中,这似乎无处不在,如果我添加此导入,我的许多单元测试突然开始失败并出现此错误: TypeError: this._unregisterListenersFn is not a function a
我在嵌套组件中使用工具提示和模态,在我的spec文件中,我在测试模块中导入NgbModule.forRoot().

除了在这个组件中,这似乎无处不在,如果我添加此导入,我的许多单元测试突然开始失败并出现此错误:

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

我正在使用Angular CLI进行捆绑/测试.

这是我测试失败的唯一组件.

我也尝试单独导入Tooltip / Modal模块及其相关提供程序,这是我一直得到上??面的错误.如果我在没有forRoot()的情况下尝试它,我会得到DI错误.

我不知道问题是什么.

这是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();
  });
});

解决方法

我有一个解决方法,但我认为这是在测试夹具中运行时NgbTooltip的一个问题.全局添加以下内容以重新定义NgbTooltip的ngOnDestroy方法:

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

注释掉的第三行可以阻止我的单元测试中出现的错误.有点黑客但在单元测试中应该没问题.我认为在测试夹具中运行时,这个函数没有在ngOnInit()中正确初始化.

我确实尝试使用overrideDirective()覆盖NgbTooltip指令但是原始似乎总是被调用.

为了找到实际的错误,我将以下内容添加到我的单元测试规范中:

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

然后显示了似乎发生的实际异常:

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)

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读