Mocha

Mocha 是一个 JavaScript 测试框架，在执行异步测试场景时尤其有用。您可以在 WebStorm 外部运行 Mocha 测试，检查以树状视图显示的测试结果，并轻松导航到测试源代码。在编辑器中测试项旁，WebStorm 会显示测试状态，并提供快速运行或调试的选项。

准备工作

请确保您的计算机上安装了 Node.js。
请确保在设置中启用了 Node.js 插件。按 Ctrl+Alt+S 打开设置，然后选择插件。点击已安装选项卡。在搜索字段中键入 Node.js。如需了解有关插件的更多信息，请参阅管理插件。

安装 Mocha

在嵌入式终端（Alt+F12 ）中键入以下命令之一：
- npm install mocha ，即可在项目中进行本地安装。
- npm install -g mocha ，即可进行全局安装。
- npm install --save-dev mocha ，以将 Mocha 安装为开发依赖项。
请参考 Mocha 官方网站的入门指南了解更多信息。

编写测试

请根据 Mocha 官方网站中的说明创建测试。

运行测试

通过 WebStorm，您可以直接在编辑器中快速运行单个 Mocha 测试，或创建运行／调试配置来执行部分或全部测试。

从编辑器运行单个测试

点击代码边栏中的或，然后从列表中选择运行 <test_name>。
您还可以在编辑器中直接看到测试是通过还是失败，这得益于代码边栏中的测试状态图标和。

创建 Mocha 运行配置

打开运行／调试配置对话框（主菜单中的运行 | 编辑配置），点击左侧面板中的，然后从列表中选择 Mocha。运行/调试配置：Mocha 对话框将打开。
指定要使用的 Node 解释器和 mocha 包的位置。
指定应用程序的工作目录。默认情况下，工作目录字段显示项目根文件夹。如需更改此预定义设置，请指定所需文件夹的路径。
可选：
配置以便在相关源文件更改时自动重新运行测试。为此，请在 Mocha 额外选项字段中添加 --watch 标志。
指定要运行的测试。可以是某个特定测试或套件、整个测试文件，或包含测试文件的文件夹。
您还可以定义模式，仅运行符合条件文件中的测试，例如 *.test.js。如果测试文件存储在单独的文件夹中，例如 test ，请在模式中指定该文件夹相对于工作目录的路径：
./folder1/folder2/test/*.test.js
选择测试中使用的接口。

通过 Mocha 运行配置运行测试

从配置列表中选择 Mocha 运行/调试配置，然后在列表或工具栏中点击。
在测试运行器选项卡的运行工具窗口中监控测试执行并分析测试结果。如需了解更多信息，请参阅查看测试结果。
- 使用点击查看差异链接打开差异查看器，并将实际结果与预期进行比较。
- 所选测试所在的文件名称显示为一个链接。点击此链接可跳转至源代码。
在测试运行器选项卡的运行工具窗口中监控测试执行并分析测试结果。如需了解更多信息，请参阅查看测试结果。

重新运行失败的测试

点击测试结果工具栏中的。 WebStorm 将执行上次会话中失败的所有测试。
如需重新运行某个特定失败测试，请在其上下文菜单中选择运行 <test name>。
或者，点击失败测试旁边代码区域中的，然后从列表中选择运行 <test name>。

如需了解更多信息，请参阅重新运行测试。

如需在测试和被测对象之间跳转，可在编辑器中打开文件，然后在上下文菜单中选择转到 | 测试(S) 或转到 | 测试对象，或直接按 Ctrl+Shift+T。
要从测试结果跳转到测试定义，请在测试运行器选项卡中双击测试名称，或从上下文菜单中选择跳转到源，或直接按 F4。测试文件将在编辑器中打开，并将光标定位在测试定义处。
对于失败的测试，WebStorm 会根据堆栈跟踪将您定位到测试中的失败行。如果堆栈跟踪中没有精确的位置，系统将跳转至测试定义。

调试测试

借助 WebStorm，您可以直接从编辑器快速开始调试单个 Mocha 测试，或创建运行/调试配置来调试部分或全部测试。

从编辑器启动单个测试的调试

在您要调试的测试旁边的代码区域设置断点。您可以通过在运行工具窗口中双击失败测试，或按 F4 跳转到测试。
点击代码区域中的或，然后从列表中选择调试 <test_name>。
在调试工具窗口中，按常规方式操作：单步执行程序、暂停并恢复程序执行、在暂停时检查程序、查看调用堆栈和变量、设置监视、计算变量、查看实际 HTML DOM 等。

通过运行／调试配置启动测试调试

在您要调试的测试旁边设置断点。您可以通过在运行工具窗口中双击失败测试，或按 F4 跳转到测试。
如上所述创建一个 Mocha 运行/调试配置。
从配置列表中选择 Mocha 运行/调试配置，然后在列表或工具栏中点击。
在打开的调试工具窗口中，按常规方式操作：单步执行程序、暂停并恢复程序执行、在暂停时检查程序、查看调用堆栈和变量、设置监视、计算变量、查看实际 HTML DOM 等。

监视代码覆盖率

借助 WebStorm，您还可以监控代码被 Mocha 测试覆盖的程度。 WebStorm 会在专用的覆盖率工具窗口中显示此统计信息，并在编辑器中及项目工具窗口中，以视觉方式标识已覆盖和未覆盖的代码行 Alt+1。要监视覆盖率，您需要安装 nyc ，这是 Istanbul 的命令行界面。

安装 nyc

在嵌入的终端（Alt+F12 ）中，键入：
npm install --save-dev nyc

运行测试并生成覆盖率报告

启动测试：
- 创建一个 Mocha 运行/调试配置（如上所述），从主工具栏中选择它，然后点击列表右侧的。
- 或者，直接从编辑器中以覆盖方式运行特定的套件或测试：点击左侧标识栏中的或，然后从列表中选择使用覆盖率运行 <test_name>。
在 Coverage 工具窗口中监视代码覆盖率。报告显示有多少文件通过测试进行了覆盖，以及这些文件中被覆盖代码行的百分比。您可以从报告中跳转到文件，查看哪些行被覆盖（绿色标记），哪些行未被覆盖（红色标记）：

在 Docker 容器中使用 Node.js 运行 Mocha 测试

使用 WebStorm，您可以在 Docker 容器中运行 Mocha 测试，其方式与本地运行相同。

准备工作

请确保在设置 | 插件页面、已安装选项卡中启用了所需插件 Node.js、 Node.js Remote Interpreter 和 Docker。有关详细信息，请参阅 Managing plugins。
按 Docker 中所述下载、安装并配置 Docker
在 Docker 中配置 Node.js 远程解释器，或通过 Docker Compose 配置，并在项目中将其设置为默认。还请确保与此远程解释器关联的软件包管理器已设置为项目默认。
打开您的 package.json ，并确保在 devDependencies 部分列出了 Mocha：
{ "name": "node-express", "version": "0.0.0", "private": true, "dependencies": { "cookie-parser": "~1.4.4", "debug": "~2.6.9", "express": "~4.16.1", "http-errors": "~1.6.3", "morgan": "~1.9.1", "pug": "^3.0.2" }, "devDependencies": { "chai": "^4.3.4", "eslint": "^8.1.0", "http-server": "^14.0.0", "mocha": "^9.1.3" } }
在编辑器任意位置右键单击，并从上下文菜单中选择运行 '<package manager> install'。

运行测试

请按照 Mocha 官方网站中的说明创建测试。
操作方式与本地开发相同：可直接从编辑器运行和调试单个测试，或创建运行/调试配置以运行部分或全部测试，如上文运行测试和调试测试所述。

最后修改日期： 2025年 9月 26日