Question

使用Jasmine测试我的6个棱角组件之一时出现错误：

找不到管道'paginate'（“” activityLogDisplay.data的项目| paginate：配置； let index = index“（click）=”）：ng：///DynamicTestModule/ActivitylogComponent.html@59： 34 “ pagination-controls”不是一个已知元素：

我正在使用通过以下命令安装的NgxPaginationModule：

npm install ngx-pagination --save

因此，请注意，我使用的不是我创建的自定义管道，而是使用属于我下载的软件包的管道。我的组件测试因使用管道而不是测试管道本身而失败。这是我对分页管道的使用在我的html模板中的样子：

 <li class="list-group-item list-group-item-action" 
    *ngFor="let alItem of activityLogDisplay.data | paginate: config; let index = index" 
    (click)="toggleALView(alItem.index)">

这是我的spec.ts文件的样子（开箱即用）：

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { ActivitylogComponent } from './activitylog.component';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ ActivitylogComponent ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(ActivitylogComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

我尝试将NgxPaginationModule的导入添加到spec.ts文件中：

import { NgxPaginationModule } from 'ngx-pagination';

我已经将其包含在TestBed配置的声明区域中：

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ ActivitylogComponent, NgxPaginationModule ]
    })
    .compileComponents();
  }));

错误消息更改为：

Failed: Unexpected module 'NgxPaginationModule' declared by the module 
'DynamicTestModule'. Please add a @Pipe/@Directive/@Component annotation.

在我的app.module.ts文件中，我在imports数组而非声明数组中列出了NgxPaginationModule：

import { NgxPaginationModule } from 'ngx-pagination';

@NgModule({
  declarations: [
    AppComponent,
    ActivitylogComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpClientModule,
    NgxPaginationModule,
    RouterModule.forRoot(appRoutes,{useHash:true})
  ],
  providers: [IndexService, AdminIndexService],
  bootstrap: [LandingpageComponent]
})

有什么想法才能使该测试正常工作吗？

Answer 1

弄清楚了我的问题。我需要将NgxPaginationModule作为导入添加到我的spec文件中的测试平台configureTestingModule区域：

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports : [
        NgxPaginationModule
      ],
      declarations: [ 
        ActivitylogComponent
       ]
    })
    .compileComponents();
  }));

在茉莉花测试中找不到角管

1 个答案: