Angular从v8升级到v12后Karma测试await fixture.whenStable始终超时

• Zone.js版本与任务队列逻辑变更：Angular v12配套的Zone.js版本相比v8有大幅调整，fixture.whenStable() 需要等待Zone管理的所有微任务、宏任务全部清空才会返回。如果你的表单valueChanges订阅逻辑中存在未完成的异步操作（比如未取消的延时器、未终止的Mock请求、处于pending状态的异步校验器），就会导致whenStable() 一直等待不到任务队列为空，最终触发超时。
• Ivy编译模式的差异：Angular v12默认启用Ivy编译模式，废弃了原有ViewEngine。Ivy下组件变更检测的调度时机、表单状态更新的微任务编排和ViewEngine完全不同，v8下可以通过detectChanges + whenStable等待到的表单更新回调，在Ivy下可能被拆分为多轮微任务执行。如果你的组件存在持续触发变更检测的逻辑（比如未取消的周期流订阅、循环触发的表单事件），会让Zone一直存在待执行任务，whenStable() 始终无法返回。
• Reactive Forms事件触发逻辑调整：Angular v10+对Reactive Forms的patchValue、setValue的事件触发逻辑做了调整，如果你的valueChanges订阅中又触发了其他表单项的值更新，且没有设置{emitEvent: false}参数，就会形成循环触发的事件流，导致任务队列永远有新的微任务加入，whenStable() 永远无法进入稳定状态。

• 优先使用fakeAsync + tick 替代whenStable：针对表单同步更新的场景，把测试用例包裹在fakeAsync中，patchValue后执行tick()即可触发所有valueChanges的回调执行，不需要等待全局异步稳定，示例如下：

it('should validate valueChanges execution result', fakeAsync(() => {
  component.testForm.patchValue({name: 'test'});
  fixture.detectChanges();
  tick(); // 执行所有待处理的同步任务与微任务
  expect(component.updatedProp).toBe('expected value');
}));

• 清理测试残留异步任务：检查测试用例中是否有未取消的valueChanges订阅、未清理的定时器，在afterEach钩子中统一取消所有订阅、清空定时器，避免残留任务影响whenStable的状态判断。
• 避免循环触发表单事件：如果valueChanges回调中需要修改其他表单项，调用patchValue/setValue时添加{emitEvent: false}参数，阻断不必要的valueChanges事件触发：

this.testForm.get('count').valueChanges.subscribe(val => {
  // 联动修改时禁用事件触发，避免循环调用
  this.testForm.get('doubleCount').patchValue(val * 2, {emitEvent: false});
});

• 自定义超时时间（应急方案）：如果确实存在合法的长耗时异步操作，可以在测试用例的第三个参数自定义超时时间，规避默认5秒超时限制：

it('should test long async operation', async () => {
  // 测试逻辑
}, 10000); // 自定义超时时间为10秒

内容的提问来源于stack exchange，提问作者peterc