1

我最近决定将我的 ionic 项目从 4 更新到 5，并想在我这样做的时候我会从 Angular 8 更新到 9。

一切顺利，应用程序按预期工作，直到我尝试运行我的单元测试。我被这个错误轰炸了，我不知道为什么。我怀疑它与路由器有关，但我什至无法确认。

Error: This constructor was not compatible with Dependency Injection.
Error: This constructor was not compatible with Dependency Injection.
    at Module.ɵɵinvalidFactory (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:14150:1)
    at Object.Router_Factory [as factory] (http://localhost:9876/_karma_webpack_/node_modules/@angular/router/__ivy_ngcc__/fesm5/router.js:4404:67)
    at R3Injector.push../node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js.R3Injector.hydrate (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:11425:1)
    at R3Injector.push../node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js.R3Injector.get (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:11247:1)
    at injectInjectorOnly (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:787:1)
    at Module.ɵɵinject (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:792:1)
    at Function.NavController_Factory [as ɵfac] (http://localhost:9876/_karma_webpack_/node_modules/@ionic/angular/__ivy_ngcc__/fesm5/ionic-angular.js:798:205)
    at Object.factory (http://localhost:9876/_karma_webpack_/node_modules/@ionic/angular/__ivy_ngcc__/fesm5/ionic-angular.js:799:96)
    at R3Injector.push../node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js.R3Injector.hydrate (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js:11425:1)
    at R3Injector.push../node_modules/@angular/core/__ivy_ngcc__/fesm5/core.js.R3Injector.get (http://localhost:9876/_karma_webpack_/node_modules/@angular/core/__ivy_ngcc__/fesm5/core.

有什么想法或其他人遇到过这个吗？

编辑

这是失败的测试之一的样子

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { IonicModule } from '@ionic/angular';

import { ZoneInstructionsComponent } from './zone-instructions.component';
import { LocationStrategy, Location, PathLocationStrategy, APP_BASE_HREF } from '@angular/common';
import { UrlSerializer, Router, RouterModule } from '@angular/router';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ ZoneInstructionsComponent ],
      imports: [ IonicModule.forRoot() ],
      providers: [
        Location,
        { provide: LocationStrategy, useClass: PathLocationStrategy },
        { provide: APP_BASE_HREF, useValue: '/page' },
        UrlSerializer,
        { provide: Router, userClass: RouterModule },
      ]
    })
    .compileComponents();
  }));

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

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

非常基本，甚至没有真正测试任何东西

编辑 2

这是组件代码，什么都不做

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'stm-zone-instructions',
  templateUrl: './zone-instructions.component.html',
  styleUrls: [
    '../installation-wizard.page.scss',
    './zone-instructions.component.scss'
  ]
})
export class ZoneInstructionsComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}
4

1 回答 1

2

好吧，这对我来说简直是愚蠢的……我正在使用很多地方

{ provide: Router, userClass: RouterModule },

显然 Angular 9 对此说不。更新我的规格以使用 RouterTestingModule，现在一切都很好。很惊讶花了这么长时间才抓住这个。我很想知道为什么，茉莉花测试还有很多东西要学。

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { IonicModule } from '@ionic/angular';

import { ZoneInstructionsComponent } from './zone-instructions.component';
import { LocationStrategy, Location, PathLocationStrategy, APP_BASE_HREF } from '@angular/common';
import { RouterTestingModule } from '@angular/router/testing';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ ZoneInstructionsComponent ],
      imports: [ RouterTestingModule.withRoutes([]), IonicModule.forRoot() ],
      providers: [
        Location,
        { provide: LocationStrategy, useClass: PathLocationStrategy },
        { provide: APP_BASE_HREF, useValue: '/page' }
      ]
    })
    .compileComponents();
  }));

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

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});
于 2020-02-26T15:30:16.960 回答