什么是自动模式？

Vitest Preview 中的自动模式是指无需在测试中手动调用 debug() 就能自动捕获和预览 DOM 状态的功能。这可以显著改善您的测试工作流程，在关键时刻提供视觉反馈。

两种自动模式

Vitest Preview 提供两种不同的自动预览选项：

1. 测试失败时自动预览

这种模式会在测试失败时自动捕获和预览 DOM 状态。它特别适用于：

• 在 CI 环境中调试测试失败
• 运行大型测试套件，手动添加 debug() 调用不切实际的情况
• 无需修改测试代码即可快速识别 UI 问题

了解更多关于测试失败时自动预览 →

2. DOM 变化时自动预览

这种模式在测试执行期间持续监控 DOM 变化，并在 DOM 被修改时自动捕获状态。它非常适合：

• 实时观察 UI 过渡和状态变化
• 调试具有多个 DOM 更新的复杂交互
• 对动画或动态内容进行视觉测试

了解更多关于 DOM 变化时自动预览 →

选择合适的自动模式

两种自动模式服务于不同目的：

• 测试失败时自动预览最适合在不添加手动调试调用的情况下捕获测试失败时的问题
• DOM 变化时自动预览最适合观察测试执行期间 UI 的演变

您可以根据特定的测试需求独立使用任一模式或将它们结合使用。

开始使用自动模式

要开始使用自动模式，请选择最适合您需求的方法：

# 使用 CLI 设置测试失败时自动预览
vitest-preview setup --automaticMode

或者将 DOM 变化时自动预览添加到您的测试中：

import { autoPreviewOnDomChanges } from 'vitest-preview';

// 将此添加到您的测试设置文件中
autoPreviewOnDomChanges();

有关更详细的说明，请参阅每种自动模式的具体指南。