Angular 6单元测试:在AllAll \n引用错误之后抛出错误:无法找到变量:$ thrown

Question

在运行我的单元测试时,有时即使它们通过,在所有测试运行结束时,我也会收到以下错误.

在运行PhantomJS的Jenkins CI构建中:

.PhantomJS 2.1.1 (Linux 0.0.0) ERROR
  {
    "message": "An error was thrown in afterAll\nReferenceError: Can't find variable: $ thrown",
    "str": "An error was thrown in afterAll\nReferenceError: Can't find variable: $ thrown"
  }

或者在Chrome上:

Chrome 67.0.3396 (Windows 7 0.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"
  }

我也有非常不可靠的测试,有时候他们没有改变任何东西会成功,有时候同样的测试会失败,所以我知道一些奇怪的事情正在发生.

Answer 1

另一件事也帮助我并解决了我的一些问题是在每次测试后添加语句以销毁夹具

  afterEach(() => {
    fixture.destroy();
  });

Answer 2

我的问题是我的测试中由于一种非常愚蠢的方式设置我的测试而遇到了竞争条件,但我想在此处记录它,因为我努力在互联网上找到我的问题的答案.

我以某种方式做的是声明两个beforeEach函数来设置我的测试,其中一个是异步的,所以我有一个竞争条件,有时它们会乱序而失败.

以下是我的测试结果:

beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ HomeComponent ]
    })
    .compileComponents();
  }));

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

因此,为了解决这个问题,我将所有设置放入一个同步的beforeEach中.

  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [HomeComponent]
    }).compileComponents();
    fixture = TestBed.createComponent(HomeComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

我浪费了太多时间试图解决这个问题,所以我把它放在这里以拯救别人.

Answer 3

我们面临着类似的问题,包括相同的间歇性错误和间歇性的失败测试.这似乎是因为当升级到Angular 6时我们也升级到Jasmine 3,其中以随机顺序运行测试显然现在是默认值.通过将random设置为false,我们不再看到这些问题.我们通过在karma.conf.js中添加此设置来完成此操作:

  config.set({
    client: {
      jasmine: {
        random: false
      }
    }
  })

Answer 4

我有一个类似的问题，似乎自Angular v6和Karma v3起，这个模糊的afterAll错误已经开始出现（https://github.com/jasmine/jasmine/issues/1523）。对于我自己，此错误不会使测试失败，但会使套件失败。

在查看了此问题的许多答案之后，似乎原因几乎总是不同的，这使得很难在线寻求帮助。可以希望在某个时候添加补丁更新，以冒出更好的错误。

我的错误

[INFO] HeadlessChrome 71.0.3542 (Linux 0.0.0) DialogComponent #apply should save. FAILED
[INFO]  Uncaught TypeError: Cannot read property 'nativeElement' of undefined thrown
[INFO]       [31m? [39m[31mshould save.[39m
[INFO]  Uncaught TypeError: Cannot read property 'nativeElement' of undefined thrown
[INFO] 
[INFO] HeadlessChrome 71.0.3542 (Linux 0.0.0) DialogComponent #apply should save. FAILED
[INFO]  Uncaught TypeError: Cannot read property 'nativeElement' of undefined thrown
[INFO] HeadlessChrome 71.0.3542 (Linux 0.0.0) DialogComponent #apply should save. FAILED
[INFO]  Uncaught TypeError: Cannot read property 'nativeElement' of undefined thrown
[INFO] HeadlessChrome 71.0.3542 (Linux 0.0.0) ERROR
[INFO]   {
[INFO]     "message": "An error was thrown in afterAll\nUncaught TypeError: Cannot read property 'nativeElement' of undefined thrown\nUncaught TypeError: Cannot read property 'nativeElement' of undefined thrown",
[INFO]     "str": "An error was thrown in afterAll\nUncaught TypeError: Cannot read property 'nativeElement' of undefined thrown\nUncaught TypeError: Cannot read property 'nativeElement' of undefined thrown"
[INFO]   }

寻找有问题的测试

我收到此afterAll错误消息，不知道是什么原因导致的，或者是什么测试触发了它。我所做的第一件事是安装karma-spec-reporter： npm install karma-spec-reporter --save-dev

将此添加到karma.conf.js文件中的plugins数组中：这将为您提供规格报告器，并将其添加spec到reports数组中：reporters: ['spec'],

下次运行测试时afterAll，有问题的测试后，您将在控制台中看到错误。

我的问题/解决方案

我发现测试正在进行htmlElement.click()。我将其更改为：htmlElement.dispatchEvent(new Event('click)) 瞧，测试开始通过了。

摘要

通常，我避免.click()在HTMLElement上使用。同样，当用户与UI交互时，它是通过事件完成的，因此它可以更正确地模仿用户的操作，这在测试时总是一件好事。

Answer 5

发生此错误时，请检查karma打开的浏览器并检查其控制台是否有错误。通常，这里会有堆栈跟踪，这将帮助您解决问题。这也适用于业障引发的其他无法提供信息的错误。