Angular/Karma单元测试错误"1个计时器仍在队列中" [英] Angular/Karma unit test error "1 timer(s) still in the queue"

问题描述

这几乎不是我第一次遇到"1个计时器仍在队列中" ，但是通常我会找到使用 tick()的方法或 detectChanges()等，以摆脱它.

This is hardly first encounter I've had with "1 timer(s) still in the queue", but usually I find some way to use tick() or detectChanges(), etc., to get out of it.

在我尝试测试我知道应该抛出异常的条件之前，下面的测试工作正常:

The test below was working fine until I tried to test for a condition that I know should throw an exception:

  it('should be able to change case', fakeAsync(() => {
    expect(component).toBeTruthy();

    fixture.whenStable().then(fakeAsync(() => {
      component.case = 'lower';
      fixture.autoDetectChanges();
      tick(500);
      const input = fixture.nativeElement.querySelector('input') as HTMLInputElement;
      typeInElement('abcDEF', input);
      fixture.autoDetectChanges();
      tick(500);
      expect(component.text).toEqual('abcdef');

      component.case = 'upper';
      fixture.autoDetectChanges();
      tick(500);
      typeInElement('abcDEF', input);
      fixture.autoDetectChanges();
      tick(500);
      expect(component.text).toEqual('ABCDEF');

      // Everything above works fine. Here's where the trouble begins
      expect(() => {
        component.case = 'foo';
        fixture.autoDetectChanges();
        tick(500);
      }).toThrowError(/Invalid case attribute/);
    }));
  }));

我正在测试的是一个Angular组件，该组件是Material输入字段的包装.该组件具有许多可选属性，其中大多数只是通用输入字段功能的直通属性，但也有一些自定义属性，例如我正在上面测试的用于大写/小写转换的属性.

What I'm testing is an Angular component that's a wrapper around a Material input field. The component has many optional attributes, most of them just pass-through attributes for common input field features, but a few custom attributes too, like the one I'm testing above for upper-/lowercase conversion.

case 属性的可接受值为 upper ， lower 和 mixed (带空字符串，null或未定义为 mixed ).该组件应该为其他任何东西抛出异常.显然可以，并且测试成功，但是随着成功，我得到了:

The acceptable values for the case attribute are upper, lower, and mixed (with empty string, null, or undefined treated as mixed). The component should throw an exception for anything else. Apparently it does, and the test succeeds, but along with the success I get:

ERROR: 'Unhandled Promise rejection:', '1 timer(s) still in the queue.', '; Zone:', 'ProxyZone', '; Task:', 'Promise.then', '; Value:', Error: 1 timer(s) still in the queue.
Error: 1 timer(s) still in the queue.
   ...

有人可以告诉我我可能做错了什么，或者是清除挥之不去的计时器的好方法吗?

Can anyone tell me what I might be doing wrong, or a good way to flush out lingering timers?

免责声明:当我寻求有关Karma单元测试的最大问题是，即使我明确搜索"karma"，我也大多会找到Pr0tractor，Pr0tractor以及更多Pr0tractor的答案.这不是Pr0tractor！(故意将零误拼写为零，因此它不会获得搜索匹配项.)

Disclaimer: A big problem when I go looking for help with Karma unit tests is that, even when I explicitly search for "karma", I mostly find answers for Pr0tractor, Pr0tractor, and more Pr0tractor. This isn't Pr0tractor! (Deliberately misspelled with a zero so it doesn't get search matches.)

更新:我可以这样解决我的问题:

UPDATE: I can work around my problem like this:

      expect(() => {
        component.inputComp.case = 'foo';
      }).toThrowError(/Invalid camp-input case attribute/);

这不像通过测试组件模板中的HTML属性分配(错误)值那样好的测试，因为我只是将值直接强加到属性本身的组件设置器中，但是，直到我有更好的解决方案为止.

This isn't as good of a test as assigning the (bad) value via an HTML attribute in the test component's template, because I'm just forcing the value directly into the component's setter for the attribute itself, but it'll do until I have a better solution.

推荐答案

我也遇到过类似的问题.解决方案是 flush 函数用法.

I have faced with the similar problem. The solution was flush function usage.

import { fakeAsync, flush } from '@angular/core/testing';

it('test something', fakeAsync(() => {

  // ...

  flush();
}));

这篇关于Angular/Karma单元测试错误"1个计时器仍在队列中"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！