笑话
最后修改时间:2023 年 9 月 7 日所需插件:
Javascript and TypeScript
- 该插件仅在 IntelliJ IDEA Ultimate 中可用,默认情况下启用。
Jest是一个专门针对客户端 JavaScript 应用程序和React应用程序的测试平台。从Jest官方网站了解有关该平台的更多信息。
您可以直接在 IntelliJ IDEA 中使用 Jest 运行和调试测试。您可以在树视图中查看测试结果,并从那里轻松导航到测试源。测试状态显示在编辑器中测试的旁边,并提供快速运行或调试的选项。
在你开始之前
安装和配置 Jest
在嵌入式终端( ) 中,键入:AltF12
npm install --save-dev jest
从Jest 官方网站上的入门和配置 Jest了解更多信息。
运行测试
借助 IntelliJ IDEA,您可以直接从编辑器快速运行单个 Jest 测试,或创建运行/调试配置来执行部分或全部测试。
有关为 JavaScript 和 TypeScript 代码创建 Vitest 测试的更多信息,请参阅Vitest 官网的Vitest 功能。
从编辑器运行单个测试
单击装订线中的或,然后从列表中选择运行 <test_name> 。
通过测试状态图标和装订线,您还可以直接在编辑器中查看测试是通过还是失败。
从项目工具窗口运行文件夹中的所有测试
在“项目”工具窗口中,选择包含测试的文件夹,然后选择“运行 <文件夹名称> 中的测试”。
创建 Jest 运行配置
打开“运行/调试配置”对话框(主菜单上的“运行”|“编辑配置” ),单击左侧窗格,然后从列表中选择Jest 。“运行/调试配置:Jest ”对话框打开。
提示
或者,在“项目”工具窗口中选择一个测试文件,然后从上下文菜单中选择“创建 <文件名>” 。
指定要使用的 Node.js 解释器。
如果您选择项目别名,IntelliJ IDEA 将自动使用Node.js页面上的节点解释器字段中的项目默认解释器。在大多数情况下,IntelliJ IDEA 会检测项目默认解释器并填充该字段本身。
您还可以选择另一个已配置的本地或远程解释器,或者单击并配置一个新解释器。
指定jest、react-scripts、react-script-ts、react-super-scripts或react-awesome-scripts包的位置 。
指定应用程序的工作目录。默认情况下,工作目录字段显示项目根文件夹。要更改此预定义设置,请指定所需文件夹的路径。
指定要运行的测试。这可以是特定的测试或套件、整个测试文件或包含测试文件的文件夹。
(可选)指定要使用的jest.config.js或jest.config.ts文件:从列表中选择相关文件,或者在打开的对话框中单击并选择它,或者仅在字段中键入路径。
如果该字段为空,IntelliJ IDEA 会查找带有键的package.json
jest
文件。搜索是在文件系统中从工作目录向上执行的。如果没有找到合适的package.json文件,则会动态生成Jest 默认配置。可选:
配置根据相关源文件中的更改自动重新运行测试。为此,请
--watch
在Jest 选项字段中添加标志。您还可以稍后在测试会话期间按“运行”工具窗口中的“监视更改”切换按钮来打开监视模式,请参阅下面的更改时自动重新运行测试(监视模式)。
可选:
指定执行命令的环境变量。IntelliJ IDEA 将在 的完成列表中显示这些变量
process.env
。在“节点选项”字段中,可以选择键入要传递到 Node.js 可执行文件的 Node.js 特定命令行选项。可接受的选项是:
用于在运行期间
--require coffeescript/register
将CoffeeScript文件即时编译为 JavaScript。此模式要求register.js文件(包的一部分)
coffeescript
位于您的项目内。因此,请确保您已按照安装 CoffeeScript 编译器coffeescript
中所述在本地安装了该软件包。当您使用 Node.js v7 来支持Chrome 调试协议时,请使用
--inspect
或参数。否则,默认情况下调试过程将使用V8 调试协议。--inspect-brk
如果您在项目中使用ECMAScript 模块
—experimental-vm-modules
,IntelliJ IDEA 会检测它们并自动将标志添加到节点选项字段。
通过运行配置运行测试
从配置列表中选择 Jest 运行/调试配置,然后单击 列表或工具栏上的 。
在“运行”工具窗口的“测试运行器”选项卡中监视测试执行并分析测试结果。有关更多信息,请参阅探索测试结果。
重新运行失败的测试
在“测试运行程序”选项卡中,单击工具栏上的 。IntelliJ IDEA 将执行上一个会话期间失败的所有测试。
要重新运行特定的失败测试,请在其上下文菜单上选择“运行 <测试名称>” 。
根据更改自动重新运行测试(监视模式)
IntelliJ IDEA 支持监视模式,在该模式下,一旦对测试相关的源文件进行任何更改,测试就会自动重新运行。因此,您只需更改代码即可,而无需手动重新运行测试或重新启动Jest运行/调试配置。
在“测试运行程序”选项卡中,按“监视更改”切换按钮。
或者,在运行/调试配置的Jest 选项
--watch
字段中添加标志,请参阅上面的创建 Jest 运行配置。
导航
使用 IntelliJ IDEA,您可以在文件和相关测试文件之间跳转,或者从“测试运行程序”选项卡中的测试结果跳转到测试。
使用 IntelliJ IDEA,您可以在文件和相关测试文件之间跳转,以及在测试或套件定义及其测试运行选项卡中的结果之间跳转。
提示
仅当测试文件遵循流行的命名约定(例如具有 .test)时,此类导航才有效。,.规格。,或_spec。后缀,位于源文件旁边或测试文件夹中。
要在测试及其主题之间跳转(反之亦然),请在编辑器中打开文件,然后选择转到| 测试或转到 | 从上下文菜单中测试主题,或者只需按。CtrlShift0T
要从测试结果跳转到测试定义,请单击“测试运行程序”选项卡中的测试名称两次,或者从上下文菜单中选择“跳转到源” ,或者只需按。测试文件在编辑器中打开,插入符号位于测试定义处。F4
要在“测试运行程序”选项卡中从测试或套件定义跳转到其结果,请单击装订线中的或并从列表中选择“在测试树中选择 <test_name>” 。
对于失败的测试,IntelliJ IDEA 会从堆栈跟踪中将您带到测试中的失败行。如果堆栈跟踪中没有确切的行,您将进入测试定义。
快照测试
IntelliJ IDEA 与 Jest 集成支持快照测试等出色功能。
当您使用方法运行测试时,Jest 会在__snapshots__.toMatchSnapshot()
文件夹中创建一个快照文件。要从测试跳转到其相关快照,请单击测试旁边的装订线或从方法的上下文菜单中选择所需的快照。.toMatchSnapshot()
如果快照与呈现的应用程序不匹配,则测试失败。这表明代码中的某些更改导致了这种不匹配,或者快照已过时并且需要更新。
要查看导致这种不匹配的原因,请通过“测试运行程序”选项卡右侧窗格中的“单击查看差异”链接打开 IntelliJ IDEA 内置差异查看器。
您可以直接从“运行”工具窗口的“测试运行程序”选项卡更新过时的快照。
要更新特定测试的快照,请使用测试名称旁边的“单击以更新快照”链接。
要从文件更新所有过时的测试快照,请使用测试文件名旁边的“单击以更新失败的快照” 。
调试测试
借助 IntelliJ IDEA,您可以直接从编辑器快速开始调试单个 Jest 测试,或创建运行/调试配置来调试部分或全部测试。
必要时设置断点。
要从编辑器开始调试单个测试,请单击装订线中的或并从列表中选择“调试 <test_name>” 。
要开始调试文件夹中的所有测试,请在项目工具窗口中选择该文件夹,然后从上下文菜单中选择调试“<文件夹名称> 中的测试” 。
要通过运行/调试配置启动测试调试,请如上所述创建 Jest 运行/调试配置。然后从配置列表中选择 Jest 运行/调试配置,然后单击 列表或工具栏上的 。
在打开的“调试”工具窗口中,照常进行:单步执行测试、 停止和恢复测试执行、在挂起时检查测试、在控制台中运行 JavaScript 代码片段,等等。
监控代码覆盖率
借助 IntelliJ IDEA,您还可以监控Jest 测试覆盖了多少代码。IntelliJ IDEA 在专用的覆盖率工具窗口中显示此统计信息,并在编辑器和项目工具窗口中直观地标记覆盖和未覆盖的行。
运行覆盖率测试
如上所述创建 Jest 运行/调试配置。
从主工具栏的列表中选择 Jest 运行/调试配置,然后单击 列表右侧的 。
或者,从编辑器快速运行特定套件或具有覆盖率的测试:单击装订线中的或,然后从列表中选择运行 <test_name> with Coverage 。
在覆盖率工具窗口中监视代码覆盖率。该报告显示了测试覆盖了多少个文件以及其中覆盖的行的百分比。从报告中,您可以跳转到文件并查看哪些行被覆盖 - 标记为绿色 - 以及哪些行未被覆盖 - 标记为红色:
在 Docker 容器内使用 Node.js 运行 Jest 测试
借助 IntelliJ IDEA,您可以在 Docker 容器内运行Jest测试,就像在本地运行一样。
在你开始之前
在“设置”| “安装并启用Node.js 远程解释器”插件 插件页面,选项卡Marketplace ,如从 JetBrains Marketplace 安装插件中所述。
确保在“设置”|“启用”中启用了Node.js和Docker所需的插件。插件页面,选项卡已安装。有关更多信息,请参阅管理插件。
按照Docker中的说明下载、安装和配置Docker
在 Docker 中或通过Docker Compose配置 Node.js 远程解释器,并将其设置为项目中的默认解释器。还要确保与此远程解释器关联的包管理器设置为项目默认值。
打开package.json并确保 Jest 在以下
devDependencies
部分中列出:{ "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": { "eslint": "^8.1.0", "http-server": "^14.0.0", "jest": "^27.3.1" } }
右键单击编辑器中的任意位置,然后从上下文菜单中选择运行“<package manager> install” 。
运行测试
感谢您的反馈意见!