angular2ync和angular2测试中的异步有什么区别 [英] What is the difference between fakeAsync and async in angular2 testing

问题描述

我知道tick（）函数使用fakeAsync。而且我也可以使用fixture.whenStable（）。then（）和async以及fakeAsync。我想知道两者的确切用例。任何人都可以通过示例解释这一点。

注意：我想在两种情况下使用虚假服务或存根。

解决方案

在大多数情况下，它们可以互换使用。除了外部模板和样式未内联编译到组件中以进行测试的组件外，我无法想到任何一个需要的问题。 （即使用SystemJS）。使用SystemJS时，会对外部模板和样式进行XHR调用。在进行XHR调用时，无法使用 fakeAsync 。另一方面，当使用Webpack时，外部模板和样式会内联编译，因此您可以使用 fakeAsync 。

<除此之外，我认为这是风格偏好的问题。我可以说的一件事是想象你需要进行多次异步调用，比如这个例子。你需要嵌套的 fixture.whenStable（）调用，调用start看起来很丑陋

  fixture.detectChanges（）; 
 fixture.whenStable（）。then（（）=> {
 expect（something）
 
 changeSomething（）
 fixture.detectChanges（）; 
 fixture.whenStable（）。then（（）=> {
 expect（something）
 changeSomething（）; 
 fixture.detectChanges（）
 
 fixture。 whenStable（）。then（（）=> {
 expect（somthingeElse）
}）
}）
}）
  

如果没有所有 fixture.whenStables（） <这可能看起来更干净（也更容易推理） / p>

  fixture.detectChanges（）; 
 tick（）; 
 expect（某物）
 
 changeSomething（）
 fixture.detectChanges（）; 
 tick（）; 
 expect（somethingElse）
 
 changeSomething（）
 fixture.detectChanges（）; 
 tick（）; 
 expect（somethingElse）; 
  

我可能添加的另一件事是 OCD 部分我总是需要在 fixture.whenStable中检查我的电话（）被称为

  fixture.whenStable（）。then（（）=> {
 expect（...）
 console.log（'called ...'）
}）
  

想象一下，您忘记将测试包装在 async 中。没有它，测试将在 fixture.whenStable 分辨率之前完成，你永远不会知道它。它看起来像测试通过，这是一个误报。实际发生的事情是断言从未被调用过。

因此，我实际上已经离开了 async 。但如果您喜欢这种风格，并且相信自己总是将测试包装在 async 中，那么请坚持下去。但是使用 fakeAsync ，所有内容都是同步调用的，所以不能调用断言。

I know that tick() function utilizes fakeAsync. And also I can use fixture.whenStable().then() with async and fakeAsync as well. I want to know the exact use case for both of them. Can anyone explain this with examples.

Note : I want to use Fake Service or Stub in both the scenarios.

解决方案

For the most part they can be used interchangeably. I can't think of anything off the top of my head in which one is required over the other, except for the case of components whose external templates and styles are not compiled inline in to the component for testing (i.e. using SystemJS). When using SystemJS, XHR calls are made for the external templates and styles. fakeAsync cannot be used when there are XHR calls made. On the other hand, when using Webpack, the external templates and styles get compiled inline, so you can use fakeAsync.

Other than that, I think it's a matter of style preference. One thing I can say is imagine you need to make multiple calls that are asynchronous, like in this example. You need nested fixture.whenStable() calls, which call start to look to pretty ugly

fixture.detectChanges();
fixture.whenStable().then(() => {
  expect(something)

  changeSomething()
  fixture.detectChanges();
  fixture.whenStable().then(() => {
    expect(something)
    changeSomething();
    fixture.detectChanges()

    fixture.whenStable().then(() => {
      expect(somthingeElse)
    })
  })
})

This might look cleaner (and easier to reason about) without all those fixture.whenStables()

fixture.detectChanges();
tick();
expect(something)

changeSomething()
fixture.detectChanges();
tick();
expect(somethingElse)

changeSomething()
fixture.detectChanges();
tick();
expect(somethingElse);

Another thing I might add is the OCD part of me always needs to check that my calls in the fixture.whenStable() is called

fixture.whenStable().then(() => {
  expect(...)
  console.log('called...')
})

Imagine that you forgot to wrap the test in async. Without that, the test will complete before the fixture.whenStable resolution, and you will never know it. It will look like the test passed, which is a false positive. What actually happened is that the assertion was never even called.

For this reason, I've actually been moving away from async. But if you like that style, and trust yourself that you always wrap the test in async, then stick with it. But with fakeAsync, everything is called synchronously, so there's no chance of the assertion not being called.

这篇关于angular2ync和angular2测试中的异步有什么区别的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！