如果在特定文件夹中，由 angular CLI 生成的测试失败

Question

我通过运行ning ng g c components/foo 使用 angular CLI (v6.1.4) 在我的组件文件夹中生成了一个组件，然后运行 ng test。新组件的测试失败并出现以下错误：

Zone is needed for the async() test helper but could not be found. Please make sure that your environment includes zone.js/dist/zone.js thrown

Error: Illegal state: Could not load the summary for directive FooComponent.

奇怪的是，如果我运行 ng g c foo （即它不会在组件文件夹中生成），那么测试就会通过。我的测试都适用于其他文件夹，但这是我的组件文件夹中的第一个测试（也是组件的第一个测试）。 None 的其他测试是异步的。

我是 ng test 的新手，所以我可能遗漏了一些非常明显的东西。我没想到需要为运行的默认测试设置 zone.js 的任何内容。我应该在哪里配置这个？或者还有什么我在这里遗漏的东西，也许是我的 components 文件夹特有的东西？

Answer 1

将以下内容添加到 foo.component.spec.ts 的顶部解决了这个问题，但我仍然不明白如果测试不在 components 文件夹中，为什么它们会起作用。如果有人有解释或解决方案不涉及在每个组件的测试文件中重复这一点，我很想听听！

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 2

在我这里的例子中，我想知道我的项目是否可能是用不同版本的主要测试配置生成的，所以我用 Angular CLI 创建了一个新的空项目，比较了两个版本的 src/test.ts 我意识到这个文件确实不同，我的应用程序缺少第一行以下行：

import 'zone.js/dist/zone-testing'

将它添加到src/test.ts文件后，这个错误就消失了！

这可能比 Tim 的回答建议的将所有这些 js 文件导入所有规范要好得多。

Answer 3

除了通过在 test.ts 文件上组织导入解决了我的问题之外，请记住项目中的以下设置可能会使您运行再次遇到问题，因此 关于 test.ts 文件，请检查以下内容：

停用 onSave 优化导入。
避免运行ning Prettier, Beautify 或其他重组导入（包或插件）的代码样式格式化程序。
检查预提交挂钩，例如 Husky 格式化文件并重新组织导入。

享受无忧编码！ :D

如果在特定文件夹中，由 angular CLI 生成的测试失败

Test generated by angular CLI fails if in a specific folder

typescript

zonejs

angular-cli

angular

angular-cli-v6