繁体   English   中英

在WebStorm中使用Angular 2调试Karma / Jasmine测试

[英]Debugging Karma/Jasmine Tests with Angular 2 in WebStorm

我正在尝试在WebStorm(2016.3.2)中调试Angular 2测试。 我尝试的第一件事只是在Chrome Dev工具中执行此操作,但是实际上我看不到Sources中的脚本文件能够设置断点。 请注意,您可以在HTML页面中看到脚本标签,但是Sources中没有任何内容。

Chrome开发人员工具捕获

因此,我做了一些进一步的挖掘工作,发现您可以设置WebStorm来运行和调试单元测试

测试确实可以运行,但是WebStorm断点从未触及,发生的事情似乎有些“偏离”。 显然,我之前没有使用过WebStorm来运行或调试单元测试,所以我不知道它的正常外观。

在此处输入图片说明 在此处输入图片说明 在此处输入图片说明

我确定我只是缺少一些东西,但是由于有许多陌生的技术融合在一起,所以我不确定要拉什么线程。

我已经编辑了业力配置文件,以包含ts文件和地图文件。 当我将它们都设置为include = false并使用ng test从终端启动时,“源”窗口看起来像这样: Chrome开发工具

这是我以前看到的内容,但它让我感到困惑,因为我希望看到自己的文件。 但是,如果我搜索该文件,则会找到自己的代码: 我在test.ts文件中的代码

它仍然不会在断点处停止,但这是一个开始。

当我尝试通过Webstorm调试它时,它仍然将Mime类型视为video / mp2t,因此我猜测它会以某种方式干扰Karma配置文件中设置的Mime类型。

我发现自己想知道开发此Framework的开发人员是否会构建除Frameworks之外的其他任何东西,因为在任何情况下,他们似乎已经竖起了巨大的不必要的障碍来实际查看应用程序中发生的事情。

更新:

看来这是Angular-CLI中的一个错误 今天似乎处于“进入”阶段。

更新2

您可以在localhost://文件夹旁边的webpack://文件夹中找到文件。 逻辑上认为您需要的文件将位于明显的站点根目录中,但事实并非如此。

在此处输入图片说明

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM