2

我使用 Angular 6 ( https://github.com/KrunalLathiya/Angular6CRUDTutorial )克隆了一个入门项目。我删除了 Karma 并安装了 Jest。该站点加载正常，但单元测试失败并出现以下错误：

Illegal state: Could not load the summary for directive AppComponent.
  at syntaxError (../../../../../execroot/angular/packages/compiler/src/util.ts:100:17)
  at CompileMetadataResolver.Object.<anonymous>.CompileMetadataResolver.getDirectiveSummary (../../../../../execroot/angular/packages/compiler/src/metadata_resolver.ts:426:11)...

app.component.ts：

import { Component } from '@angular/core';
import { SlimLoadingBarService } from 'ng2-slim-loading-bar';
import { 
  NavigationCancel,
  Event,
  NavigationEnd,
  NavigationError,
  NavigationStart,
  Router } from '@angular/router';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
  title = 'app';
  constructor(private _loadingBar: SlimLoadingBarService, private _router: Router) {
    this._router.events.subscribe((event: Event) => {
      this.navigationInterceptor(event);
    });
  }
  private navigationInterceptor(event: Event): void {
    if (event instanceof NavigationStart) {
      this._loadingBar.start();
    }
    if (event instanceof NavigationEnd) {
      this._loadingBar.complete();
    }
    if (event instanceof NavigationCancel) {
      this._loadingBar.stop();
    }
    if (event instanceof NavigationError) {
      this._loadingBar.stop();
    }
  }
}

app.component.test.ts：

import { AppModule } from "./app.module";
import { TestBed, ComponentFixture, async } from '@angular/core/testing';
import { APP_BASE_HREF } from '@angular/common';
import { Router } from '@angular/router';
import { AppComponent } from './app.component';

describe('AppComponent', () => {
  beforeEach(() => {
    class loading = { return { events: {} } };
    class router = {};
    TestBed.configureTestingModule({
      // imports: [AppModule], // didn't help
      declarations: [
        AppComponent
      ],
      providers: [
        AppComponent,
        // { provide: APP_BASE_HREF, useValue: '/' }, // didn't help
        { provide: SlimLoadingBarService, useClass: loading },
        { provide: Router, useClass: router }
      ],
    }).compileComponents();
  });

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
  });
});

我需要一些特定的东西让 Jest 和 Angular 一起工作吗？谢谢！

4

0 回答 0