Question

我使用NG-CLI（beta.15）创建了一个新项目并修改了app.component.spec以将beforeEach更改为beforeAll并导致测试失败以下错误：

失败：无法创建组件AppComponent，因为它未导入测试模块！

我不明白这个错误意味着什么，当然为什么我会在第一时间得到它。

以下是修改后的规范：

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';

describe('App: Ng2CliTest2', () => {
  beforeAll(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
    });
  });

  it('should create the app', async(() => {
    let fixture = TestBed.createComponent(AppComponent);
    let app = fixture.debugElement.componentInstance;
    expect(app).toBeTruthy();
  }));

  it(`should have as title 'app works!'`, async(() => {
    let fixture = TestBed.createComponent(AppComponent);
    let app = fixture.debugElement.componentInstance;
    expect(app.title).toEqual('app works!');
  }));

  it('should render title in a h1 tag', async(() => {
    let fixture = TestBed.createComponent(AppComponent);
    fixture.detectChanges();
    let compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('h1').textContent).toContain('app works!');
  }));
});

然后我将规范修改为此，前两个测试通过，第三个测试失败并显示以下消息：

失败：尝试使用已销毁的视图：detectChanges

import { TestBed, async } from '@angular/core/testing';
import { AppComponent } from './app.component';

let fixture;
let app;

describe('App: Ng2CliTest2', () => {
  beforeAll(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppComponent
      ],
    });
    fixture = TestBed.createComponent(AppComponent);
    app = fixture.debugElement.componentInstance;        
  });

  it('should create the app', async(() => {
    expect(app).toBeTruthy();
  }));

  it(`should have as title 'app works!'`, async(() => {
    expect(app.title).toEqual('app works!');
  }));

  it('should render title in a h1 tag', async(() => {
    fixture.detectChanges();
    let compiled = fixture.debugElement.nativeElement;
    expect(compiled.querySelector('h1').textContent).toContain('app works!');
  }));
});

我不明白为什么会有任何失败。

Answer 1

在不知情的情况下，Angular实际上resets the testing module在其自己的卧底beforeEach（see testing.ts）

var _global = <any>(typeof window === 'undefined' ? global : window);

// Reset the test providers and the fake async zone before each test.
if (_global.beforeEach) {
  _global.beforeEach(() => {
    TestBed.resetTestingModule();
    resetFakeAsyncZone();
  });
}

我甚至没有试过这个，但你想知道如何尝试和（安全地）禁用此功能，这是我已经想到的：

您的配置中已导入

@angular/core/bundles/core-testing.umd.js

这在karma-test-shim.js文件中很多次。该文件包含我们在Angular测试中使用的几乎所有测试实用程序。它几乎是从testing module导出的所有内容的汇编。这包括上面添加全局beforeEach调用的测试文件。

如果从上述信息中看不出来，beforeAll仅对第一次测试有效，那么Angular将重置测试床。因此，下一个测试是您尝试从空的测试台配置创建组件。

Answer 2

对于正在寻找一种方法来真正防止Angle重置测试台的人：see this article

使用beforeAll而不是beforeEach时，Angular 2 CLI Jasmine单元测试失败

2 个答案: