Vitest 1.0 官宣升级!Vue 都集成的测试框架!

大家好,这里是大家的林语冰。本期《前端翻译计划》共享的是 Vitest 1.0 的版本升级公告。

地球人都知道,测试乃前端进阶的必由之路,TDD(测试驱动开发)不仅可以用作开发范式,也可以用作学习方法论,比如用来读源码、刷笔试题等。

Vitest 是一个原生支持 Vite 的测试框架,连人气爆棚的 Vue 都悄咪咪将其测试库替换为 Vitest,还好我有在暗中观察。

免责声明

本文属于是语冰的直男翻译了属于是,略有删改,仅供粉丝参考,英文原味版请临幸 vitest v1.0.0

Vitest 团队官宣,vitest v1.0 正式发布!本文列出了在测试期间对项目所做的所有更改。有关迁移指南,请传送 迁移指南

注意,Vitest 是从 v0.34.6 经历了若干 Beta(公测版)阶段后渐进升级为 v1.0,这意味着,这是一个大型的主版本更新,所以一定会存在破坏性更新,除了本文翻译的版本升级公告外,官方文档的迁移指南也是重要参考资料(已有中文文档),请大家按需自习。另外,公告中所有更新都有对应详情,如有需要,请传送 GitHub 更新日志。

破坏性更新

  • 全新支持 poolpoolOptions,移除旧标志
  • 支持多并行 child_process
  • 使快照更吸睛
  • 为子级软件包(sub packages)设置 vitest peer dependency 范围
  • 将 Node 最低版本提高到 v18,匹配 Vite 5 的要求
  • 移除已弃用的 Node 加载器
  • 将浏览器提供者移动到 @vitest/browser
  • 移除 EnhancedSpy 类型,弃用 SpyInstance,优化 mocksvi 文档
  • expect().toContain() 可以处理 classListNode.contains 和任何类数组结构。这意味着,您不能使用它来检查一个对象是否是另一个对象的子集 ------ 这种情况下请使用 expect().toMatchObject()
  • runner:正确处理自定义任务,更新 runner 钩子
  • 覆盖率:
    • glob 筑基的覆盖率阈值
    • 使用 transformMode 和源码映射筑基的工作区项目
    • 默认启动 coverage.all

功能

  • 添加 Marko 示例,且涵盖 Marko 文件的代码覆盖率
  • 更新 magic-string
  • 实现 provide/inject API,用于从主线程传输数据
  • 优化 expectTypeOf 的错误消息
  • 新增 test.sequential() API
  • 允许自定义进程池
  • 新增 --project 选项以限制正在运行的项目
  • 基准测试:
    • importTinybench 移动到 runner
  • 浏览器:
    • 支持"none"提供者,并更新 lit 示例来使用它
  • 覆盖率:
    • 支持 /* v8 ignore... 忽略提示
  • expect
    • 支持 expect.closeTo API
    • 基于 href 比较 URL 对象
  • 快照:
    • 新增配置快照目录的选项
  • vite-node
    • 支持 Vite 5 的 import.meta.hot.off
  • Vitest:
    • 暴露 getBenchFngetBenchOptions
    • 在测试期间运行类型检查
    • 过滤堆栈跟踪
    • execArgv 暴露给不同的池

Bug 修复

  • 在 VM + JSDOM 中新增多个全局变量
  • 忽略 snapshotFormat 选项中的 "plugins" 字段
  • nextTick 模拟错误消息以提及正确的配置选项
  • 导出 VitestUtils 接口
  • 断言差异消息处理不可写的子属性
  • 不会从 Rollup 打包导入
  • 支持在依赖固定装置(fixtures)的相同索引处访问固定装置
  • 使异步固定装置并发工作
  • Coverage.100 在用作 cli 参数时崩溃
  • 支持诉诸 Yarn PnP 检查类型
  • 支持从测试上下文访问任务,而无需访问固定装置
  • 将自定义非对称匹配器复制到局部 expect
  • 将序列化程序用于抛出快照的 Error 实例
  • 运行"vitest typecheck"时抛出错误
  • 默认禁用快照差异展开
  • 处理固定装置抛出的错误
  • 默认 ------ 启动 !process.env.CI
  • 当用户配置禁用 ESBuild 时禁用它
  • 在嵌套套件中继承并发/顺序
  • 向非对称匹配器提供 customTester
  • 应用测试测试文件的 retrybail
  • 根据文件路径过滤时,遵循尾斜杠
  • 使用 setSystemTime 时的日期原型
  • BrowserTestRunner 调用了不正确的 super 方法
  • 为闲置工作线程设置进程名称
  • 基准:
    • 提取 ChainableBenchmarkAPI 类型
  • 浏览器:
    • 优化错误处理,在浏览器模式下不依赖 Node.js 内置模块
    • 禁用劫持 ES 模块,直到实现 vi.mock
    • 将 vitest/imports 添加到 entries 中
    • 等到 vite 完成 vitest 依赖的预打包
    • 允许 pretty-format 作为同级依赖项
    • 禁止无限重新加载循环,如果捕获到"error"事件,不会执行失败
    • 遵循 vite 配置中的"server"选项
  • cli:
    • 在运行模式下不捕获 stdin
  • 配置:
    • defineConfigpoolpoolMatchGlobs 的类型问题
  • 代码覆盖:
    • thresholdAutoUpdate 检测零限制
    • 默认排除以点开头的文件和目录
    • 通过在文件系统上写入临时文件来提高内存使用率
  • 依赖:
    • v8-to-istanbul 依赖更新到 ^9.2.0
    • std-env 依赖更新到 ^3.5.0
  • 示例:
    • 解析类型错误
  • expect
    • 发布类型文件
    • Object.freeze 破坏 toEqual
    • 发布语义正确的 chai 类型
    • Promise 对象被拒绝,则打印完整错误
    • 使用 jest expect 时不会失败
  • happy-dom:
    • 使用空配置调用 useFakeTimers 时不会崩溃
  • jsdom:
    • 调用 atob 时不会无限递归
  • runner
    • 每个测试都需要初始化固定装置
    • 嵌套测试应该报错
    • 从 TaskResult 中移除已弃用的 error 选项
    • 调用 runifskipif 时保留固定装置
    • PassWithNoTests 选项失效
  • vite-node:
    • 为 web/ssr 转换设置单独缓存
    • Mjs 文件 watch 失效
  • vitest:
    • @types/node 设为可选
    • 内联 chai 类型代替 @types/chai
    • 若工作区不运行测试,则禁止初始化 globalSetup
    • 全局或在工作区中运行时移除重复数据
    • 记录时打印文件路径而不是"未知测试"
    • 无法从 js/ts 文件加载自定义环境
    • 支持 Vite 5 的新 URL 资源
    • vi.hoisted 被赋值,则正确提升
    • 从根配置运行 globalSetup,即使它不在工作区中
    • 在 vitest 配置函数中传递正确的模式
    • 若使用 require() 导入 vitest,则报错
    • defineProject 使用正确的类型,以允许在 mergeConfig 中使用
    • 若 Vite 无法解析路径别名,则报错
    • 改进 vi.waitUntil 类型,排除虚假类型
    • 新增 import-meta.d.ts
    • 使用 happy-dom 时,正确支持 CSS 变量
    • 在工作区中传递正确的 server 选项
    • 独立模拟模拟类的每个实例的方法
  • vm:
    • createVmThreadsPool 函数中移除排序器用法

性能

  • 更新 log-update v9
  • run-mode 模式下提前关闭池
  • coverage-istanbulall: true 仪器可以检测文件

您现在收看的是《前端翻译计划》,学废了的小伙伴可以订阅此专栏合集,我们每天佛系投稿,欢迎持续关注前端生态。谢谢大家的点赞,掰掰~

相关推荐
青皮桔21 分钟前
CSS实现百分比水柱图
前端·css
失落的多巴胺21 分钟前
使用deepseek制作“喝什么奶茶”随机抽签小网页
javascript·css·css3·html5
DataGear24 分钟前
如何在DataGear 5.4.1 中快速制作SQL服务端分页的数据表格看板
javascript·数据库·sql·信息可视化·数据分析·echarts·数据可视化
影子信息26 分钟前
vue 前端动态导入文件 import.meta.glob
前端·javascript·vue.js
青阳流月28 分钟前
1.vue权衡的艺术
前端·vue.js·开源
样子201832 分钟前
Vue3 之dialog弹框简单制作
前端·javascript·vue.js·前端框架·ecmascript
kevin_水滴石穿32 分钟前
Vue 中报错 TypeError: crypto$2.getRandomValues is not a function
前端·javascript·vue.js
翻滚吧键盘33 分钟前
vue文本插值
javascript·vue.js·ecmascript
孤水寒月2 小时前
给自己网站增加一个免费的AI助手,纯HTML
前端·人工智能·html
CoderLiu2 小时前
用这个MCP,只给大模型一个figma链接就能直接导出图片,还能自动压缩上传?
前端·llm·mcp