Vitest Browser Mode 取代 jsdom：用真实像素做前端测试
Software Testing: Vitest Browser Mode statt jsdom: Tests mit echten Pixeln | heise online
Alexander Opalic 在访谈中介绍用 Vitest Browser Mode 把 Datepicker、表格和 Modal 隔离渲染在 iFrame 中，从用户视角而非方法调用做测试，能发现白底灰字这类模拟环境识别不了的问题。代价是每次点击耗时从 20 毫秒升到 200 毫秒，他还谈到为自有 UI 库做截图测试，以及代码越来越多由 AI 生成时为何更值得建立清晰的测试策略。
主题
正文 · AI 翻译
Richard Seidl与Alexander Opalic谈论为什么前端测试比后端测试要求更高，以及当组件不再运行在jsdom中，而是在真实浏览器中运行时，会发生什么变化。
广告后继续阅读
Opalic使用Vitest Browser Mode将日期选择器、表格和模态框隔离渲染在一个iFrame中，并从用户视角而非沿着它们的方法进行测试。这样，白底上的灰色文字就会自动引起注意，这是模拟环境无法识别的情况。
两人谈到了每次点击从20毫秒变成200毫秒的时间代价，谈到了为自有UI库做截图测试，以及当代码越来越多地由AI生成时，为什么值得建立清晰的测试策略。
Richard Seidl是顾问、演讲者和播客主持人。对他而言很清楚：今天想要创造卓越软件的人，会整体性地思考开发过程：人、上下文、方法和工具。他已在八本专业书籍中发表了自己的经验，成功运营着两个社区播客，并且是heise会议betterCode() Testing的顾问。
“我认为，前端测试比后端测试更复杂。”——Alexander Opalic
推荐的编辑内容
经您同意，此处将加载一个外部YouTube视频（Google Ireland Limited）。
我同意向我显示外部内容。由此可能会将个人数据传输给第三方平台（Google Ireland Limited）。更多信息请参见我们的隐私政策。
Alexander Opalic是一名拥有八年以上经验的全栈开发者，在Otto Payments工作。他在alexop.dev上撰写关于现代Web开发、TypeScript、AI Agents以及软件开发未来的文章。作为演讲者，他尤其关注新的开发者工作流、测试，以及AI如何改变我们构建软件的方式。
对话中的软件质量
这里一切都围绕软件质量展开。无论是测试自动化、敏捷项目中的质量、测试数据还是测试团队：Richard Seidl和他的嘉宾都会审视那些能为软件开发带来更多质量的事物。
广告后继续阅读
当前这一集也可在Richard Seidl的博客和YouTube上观看。
(mro)