Karma-Test:在其他测试中使用async时随机测试失败

Question

我有Karma-Tests的问题.当我运行我的测试时,有时我会遇到这个错误:

HeadlessChrome 70.0.3538 (Windows 10.0.0) ERROR
  {
    "message": "An error was thrown in afterAll\n[object ErrorEvent] thrown",
    "str": "An error was thrown in afterAll\n[object ErrorEvent] thrown"
  }

如果我没有改变任何东西并再次运行相同的测试,测试可能不会失败.

我已经读过它可能是异步测试的错误(https://github.com/karma-runner/karma/issues/2811#issuecomment-407600850),所以我删除了所有的异步和伪同步测试.但是,这仍然无法解决问题.没有异步和伪同步测试,我有这个错误:

HeadlessChrome 70.0.3538 (Windows 10.0.0) MyComponent should create FAILED
        [object ErrorEvent] thrown
HeadlessChrome 70.0.3538 (Windows 10.0.0): Executed 50 of 55 (1 FAILED) (0 secs / 0 secs)

但在这个组件的测试中我找不到错误:

describe('MyComponent', () => {
    let component: MyComponent;
    let fixture: ComponentFixture<MyComponent>;
    const zipService = jasmine.createSpyObj('ZipService', {
        search: of([])
    });

    beforeEach(() => {
        TestBed.configureTestingModule({
            declarations: [MyComponent, OnOffSwitchComponent, TranslatePipeMock],
            imports: [
                NgbModule.forRoot(),
                FormsModule,
                ReactiveFormsModule
            ],
            providers: [
                {provide: TranslateService, useValue: translateServiceMock()},
                {provide: UtilService, useValue: utilMock()},
                {provide: ZipService, useValue: zipService}
            ]
        }).compileComponents();
        fixture = TestBed.createComponent(MyComponent);
        component = fixture.componentInstance;
        fixture.detectChanges();
    });

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

有谁知道它可能是什么？

Answer 1

您的每个块之前都是错误的，因为您试图在编译部分完成之前创建组件 MyComponent，如果您查看https://angular.io/api/core/testing/TestBed#compileComponents您可以看到TestBed.compileComponents返回一个承诺。所以你测试的样板应该会发生明显的变化。首先，您需要让 beforeEach 意识到它包含一些异步活动，有不止一种方法可以做到这一点，包括本机 async/await、Angular 提供开箱即用的实用程序async()。这将把你的测试交给beforeEach(async( () => {...}))第二位，你的模拟的创建应该在组件编译时发生。所以你的代码在一起看起来像

beforeEach(async(() => {
TestBed.configureTestingModule({
    declarations: [MyComponent, OnOffSwitchComponent, TranslatePipeMock],
    imports: [
        NgbModule.forRoot(),
        FormsModule,
        ReactiveFormsModule
    ],
    providers: [
        {provide: TranslateService, useValue: translateServiceMock()},
        {provide: UtilService, useValue: utilMock()},
        {provide: ZipService, useValue: zipService}
    ]
}).compileComponents().then(() => {
   fixture = TestBed.createComponent(MyComponent);
   component = fixture.componentInstance;
   fixture.detectChanges();
  });    
}));