首页 > 解决方案 > 当我尝试对角度应用程序执行单元测试时..但是在运行测试时我遇到了错误

问题描述

1 个规格,1 个失败规格列表 | 故障概述组件应创建失败:无法解析路由器的所有参数:(?,?,?,?,?,?,?,?)。错误:无法解析路由器的所有参数:(?, ?, ?, ?, ?, ?, ?, ?)。在 CompileMetadataResolver._getDependenciesMetadata (http:// localhost:9876/ karma_webpack / webpack : /node_modules/@angular/compiler/fesm5/compiler.js:10807:1) 在 CompileMetadataResolver._getTypeMetadata (http://localhost:9876/ karma_webpack /webpack:/node_modules/@angular/compiler/fesm5/compiler.js:10700 :1) 在 CompileMetadataResolver._getInjectableTypeMetadata (http://localhost:9876/ karma_webpack/webpack:/node_modules/@angular/compiler/fesm5/compiler.js:10922:1) 在 CompileMetadataResolver.getProviderMetadata (http://localhost:9876/ karma_webpack /webpack:/node_modules/@angular/compiler/fesm5/compiler. js:10931:1) at http://localhost:9876/ karma_webpack /webpack:/node_modules/@angular/compiler/fesm5/compiler.js:10869:1 at Array.forEach () at CompileMetadataResolver._getProvidersMetadata (http:// /localhost:9876/ karma_webpack /webpack:/node_modules/@angular/compiler/fesm5/compiler.js:10829:1) 在 CompileMetadataResolver.getNgModuleMetadata (http://localhost:9876/ karma_webpack /webpack:/node_modules/@angular/编译器/fesm5/compiler.js:10548:1) 在 JitCompiler._loadModules (http://localhost:9876/ karma_webpack/webpack:/node_modules/@angular/compiler/fesm5/compiler.js:22567:1)

============================================


describe('OverviewComponent', () => {
  let component: OverviewComponent;
  let fixture: ComponentFixture<OverviewComponent>;
  let router : Router

 
  const fakeActivatedRoute = {
    snapshot: { data: {  } }
  } as ActivatedRoute;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports:[
        SharedModule,
        FlexLayoutModule,
       
       // RouterModule.forRoot(routes),
        RouterTestingModule
      ],
       
      declarations: [ OverviewComponent,
      FooterComponent,
      LoginComponent,
      ChangePasswordComponent,
      ForgotPasswordComponent,
      AppComponent],

      providers:[
      HttpClient,
      HttpHandler,
      DataService,
      NgxSpinnerService,
      Router,
      RouterModule,
      EmitterService,
      {provide: ActivatedRoute, 
        useValue: fakeActivatedRoute}
      ]
    })
    .compileComponents();
    

  }));

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


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

 
});

标签: angular6karma-jasmine

解决方案


您需要为服务路由器创建模拟。

您也可以只使用 RouterTestingModule 并像这样 spyOn 导航功能......

import { TestBed } from '@angular/core/testing';
import { RouterTestingModule } from '@angular/router/testing';
import { Router } from '@angular/router';

import { MyModule } from './my-module';
import { MyComponent } from './my-component';

describe('something', () => {

    let fixture: ComponentFixture<LandingComponent>;
    let router: Router;

    beforeEach(() => {

        TestBed.configureTestingModule({
            imports: [
                MyModule,
                RouterTestingModule.withRoutes([]),
            ],
        }).compileComponents();

        fixture = TestBed.createComponent(MyComponent);
        router = TestBed.get(Router);

    });

    it('should navigate', () => {
        const component = fixture.componentInstance;
        const navigateSpy = spyOn(router, 'navigate');

        component.goSomewhere();
        expect(navigateSpy).toHaveBeenCalledWith(['/expectedUrl']);
    });
});

字体:stackoverflow


推荐阅读