angular - 错误：fakeAsync() 测试助手需要 zone-testing.js，但找不到。使用 serenityJS+Jasmine 在 Angular webapp 上运行测试时

Question

我正在尝试使用 serenityJS + Jasmine 在 Angular Web 应用程序上运行组件测试，但遇到以下错误。知道如何解决这个问题吗？

Message:
Error: zone-testing.js is needed for the fakeAsync() test helper but could not be found.
        Please make sure that your environment includes zone.js/dist/zone-testing.js

堆栈：错误：fakeAsync() 测试助手需要 zone-testing.js，但找不到。请确保您的环境在 UserContext 的 resetFakeAsyncZone (C:\Users\zhenweiwong\Desktop\serenityjsframework\packages\core\testing\src\fake_async.ts:25:9) 中包含 zone.js/dist/zone-testing.js . (C:\Users\zhenweiwong\Desktop\serenityjsframework\packages\core\testing\src\before_each.ts:26:5) at processImmediate (internal/timers.js:439:21) at process.topLevelDomainCallback (domain.js :131:23) 消息：错误：在此配置中 Angular 需要 Zone.js 堆栈：错误：在此配置中，Angular 在新 NgZone 中需要 Zone.js (C:\Users\zhenweiwong\Desktop\serenityjsframework\packages\core\src\ zone\ng_zone.ts:129:13) 在 TestBedViewEngine._initIfNeeded (C:\Users\zhenweiwong\Desktop\serenityjsframework\packages\core\testing\src\test_bed.
在用户上下文。(C:\Users\zhenweiwong\Desktop\serenityjsframework\jasmine-test\spec\app1.component.spec.ts:32:29) 在

Answer 1

从 Angular 10 升级到 Angular 12 后，我遇到了同样的问题。然后我通过将 移动import 'zone.js/testing到文件顶部来修复它test.ts

Answer 2

您好，回答有点晚了，但我在这里留下评论以供将来参考：

错误来源

就我而言，错误是在test.ts文件中发现的。此文件设置使用命令ng generate component my-component创建时默认在 Angular 规范文件中使用的 TestBed 配置。

解决方案

修复方法是确保以下导入 在任何其他导入之前位于文件test.ts的顶部：

import 'zone.js';
import 'zone.js/testing';

请注意您的配置可能会改变这些导入的顺序，因为它可能会导致再次中断测试。这就是为什么您可以通过test.ts文件：

1. 停用 onSave 优化导入。
2. 避免运行Prettier、Beautify或其他重新组织导入的代码样式格式化程序。
3. 检查像Husky这样格式化文件并重新组织导入的预提交钩子。

进一步的故障排除

您可能还想查看是否存在以下导入：

import 'zone.js';
import 'zone.js/dist/async-test.js';
import 'zone.js/dist/proxy.js';
import 'zone.js/dist/sync-test';
import 'zone.js/dist/jasmine-patch';

此线程中的其他方法解决了相同的问题。

Answer 3

这个问题来自 Angular v11。

解决方案： 移至文件import 'zone.js/dist/zone-testing';顶部。src/test.ts