首页 > 解决方案 > 使用 matHorizo​​ntalStepper 进行测试。角材料

问题描述

我正在为垫子步进器编写测试。我遇到了错误:错误:找不到名称“matHorizo​​ntalStepper”的导出!

感谢下面的评论,我想通了。

当使用 Angular Material 组件进行测试时,您必须将它们与 BrowserAnimationsModule 和有时 ReactiveFormsModule 一起导入到您的测试文件中。

  describe('EditFulfillmentWorkflowComponent', () => {
let component: EditFulfillmentWorkflowComponent;
let fixture: ComponentFixture<EditFulfillmentWorkflowComponent>;
beforeEach(() => {
const activatedRouteStub = () => ({
  snapshot: { paramMap: { get: () => ({}) } }
});



const routerStub = () => ({ navigateByUrl: string => ({}) });
const notificationsServiceStub = () => ({});
const fulfillmentServiceStub = () => ({
  getFulfillmentWorkflows: any => ({ subscribe: f => f }),
  getOrchestratorActionInfo: any => ({ subscribe: f => f }),
  checkIfWorkflowNameExists: any => ({ subscribe: f => f(Boolean) }),
  updateFulfillmentWorkflow: submitFulfillmentWorkflow => ({
    subscribe: f => f({})
  })
});
TestBed.configureTestingModule({
  schemas: [NO_ERRORS_SCHEMA],
  declarations: [EditFulfillmentWorkflowComponent],
  imports: [MatStepperModule, BrowserAnimationsModule, ReactiveFormsModule],
  providers: [
    { provide: ActivatedRoute, useFactory: activatedRouteStub },
    { provide: Router, useFactory: routerStub },
    { provide: NotificationsService, useFactory: notificationsServiceStub },
    { provide: FulfillmentService, useFactory: fulfillmentServiceStub }
  ]
});
fixture = TestBed.createComponent(EditFulfillmentWorkflowComponent);
component = fixture.componentInstance;
});


beforeEach(() => {
fixture = TestBed.createComponent(EditFulfillmentWorkflowComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();

}); [编辑]第一条评论解决了我的问题。

标签: angularangular-materialjasminekarma-jasmine

解决方案


首先,您需要导入组件使用的所有模块。

因此,您需要导入:

import {MatStepperModule} from '@angular/material/stepper';

并将其添加importsTestBed.configureTestingModule({...})

此外,如果您在组件中使用组件,则需要declarations: [EditFulfillmentWorkflowComponent],添加TestBed.configureTestingModule({...})


推荐阅读