与其他测试运行器的比较
Jest
Jest 通过为大多数 JavaScript 项目提供开箱即用的支持、舒适的 API(it
和 expect
)以及大多数设置所需的完整测试功能包(快照、模拟、覆盖率)而占据了测试框架领域。我们感谢 Jest 团队和社区创建了令人愉快的测试 API,并推动了许多现在在 Web 生态系统中成为标准的测试模式。
可以在 Vite 设置中使用 Jest。 @sodatea 构建了 vite-jest,旨在为 Jest 提供一流的 Vite 集成。最后 Jest 中的阻碍 已经解决,因此对于您的单元测试来说这是一个有效的选择。
然而,在一个 Vite 为最常见的 Web 工具(TypeScript、JSX、最流行的 UI 框架)提供支持的世界中,Jest 代表着复杂性的重复。如果您的应用程序由 Vite 提供支持,那么配置和维护两个不同的管道是不可取的。使用 Vitest,您可以将开发、构建和测试环境的配置定义为一个单一管道,共享相同的插件和相同的 vite.config.js。
即使您的库没有使用 Vite(例如,如果它是使用 esbuild 或 Rollup 构建的),Vitest 也是一个不错的选择,因为它可以为您的单元测试提供更快的运行速度,并且由于使用 Vite 即时热模块替换 (HMR) 的默认监视模式,因此可以提高 DX。Vitest 提供与大多数 Jest API 和生态系统库的兼容性,因此在大多数项目中,它应该是 Jest 的直接替代品。
Cypress
Cypress 是一个基于浏览器的测试运行器,也是 Vitest 的补充工具。如果您想使用 Cypress,我们建议将 Vitest 用于应用程序中的所有无头逻辑,将 Cypress 用于所有基于浏览器的逻辑。
Cypress 以端到端测试工具而闻名,但他们的 新的组件测试运行器 对测试 Vite 组件有很好的支持,是测试在浏览器中呈现的任何内容的理想选择。
基于浏览器的运行器,如 Cypress、WebdriverIO 和 Web Test Runner,会捕获 Vitest 无法捕获的问题,因为它们使用真实的浏览器和真实的浏览器 API。
Cypress 的测试驱动程序专注于确定元素是否可见、可访问和可交互。Cypress 专为 UI 开发和测试而构建,其 DX 以测试驱动您的视觉组件为中心。您会看到您的组件与测试报告器一起呈现。测试完成后,组件保持交互性,您可以使用浏览器开发者工具调试发生的任何错误。
相比之下,Vitest 专注于为闪电般快速的无头测试提供最佳的 DX。基于 Node 的运行器,如 Vitest,支持各种部分实现的浏览器环境,如 jsdom
,它实现了足够的功能,让您能够快速单元测试任何引用浏览器 API 的代码。权衡是这些浏览器环境在它们可以实现的功能方面存在局限性。例如,jsdom 缺少许多功能,如 window.navigation
或布局引擎(offsetTop
等)。
最后,与 Web Test Runner 相比,Cypress 测试运行器更像是一个 IDE,而不是一个测试运行器,因为您还会在浏览器中看到真实的渲染组件,以及它的测试结果和日志。
Cypress 也一直在 将 Vite 集成到他们的产品中:使用 Vitesse 重新构建他们的应用程序的 UI,并使用 Vite 测试驱动他们的项目的开发。
我们认为 Cypress 不是单元测试无头代码的理想选择,但使用 Cypress(用于 E2E 和组件测试)和 Vitest(用于单元测试)可以满足您应用程序的测试需求。
WebdriverIO
WebdriverIO 与 Cypress 类似,是一个基于浏览器的替代测试运行器,也是 Vitest 的补充工具。它可以用作端到端测试工具,也可以用于测试 Web 组件。它甚至在幕后使用 Vitest 的组件,例如用于 组件测试中的模拟和存根。
WebdriverIO 与 Cypress 具有相同的优势,允许您在真实的浏览器中测试您的逻辑。但是,它使用实际的 Web 标准 进行自动化,这克服了在 Cypress 中运行测试时的一些权衡和局限性。此外,它允许您在移动设备上运行测试,让您能够在更多环境中测试您的应用程序。
Web Test Runner
@web/test-runner 在无头浏览器中运行测试,提供与您的 Web 应用程序相同的执行环境,而无需模拟浏览器 API 或 DOM。这也使得可以在真实的浏览器中使用开发者工具进行调试,尽管没有像 Cypress 测试那样显示用于逐步执行测试的 UI。
要将 @web/test-runner 与 Vite 项目一起使用,请使用 @remcovaes/web-test-runner-vite-plugin。@web/test-runner 不包含断言或模拟库,因此您需要自己添加它们。
uvu
uvu 是一个用于 Node.js 和浏览器的测试运行器。它在单个线程中运行测试,因此测试没有隔离,并且可能会跨文件泄漏。然而,Vitest 使用工作线程来隔离测试并并行运行它们。
为了转换您的代码,uvu 依赖于 require 和加载器钩子。Vitest 使用 Vite,因此文件将使用 Vite 插件系统的全部功能进行转换。在一个 Vite 为最常见的 Web 工具(TypeScript、JSX、最流行的 UI 框架)提供支持的世界中,uvu 代表着复杂性的重复。如果您的应用程序由 Vite 提供支持,那么配置和维护两个不同的管道是不可取的。使用 Vitest,您可以将开发、构建和测试环境的配置定义为一个单一管道,共享相同的插件和相同的配置。
uvu 没有提供智能监视模式来重新运行已更改的测试,而 Vitest 由于使用 Vite 即时热模块替换 (HMR) 的默认监视模式,因此可以为您提供出色的 DX。
uvu 是运行简单测试的快速选择,但对于更复杂的测试和项目,Vitest 可能更快且更可靠。