Wagmi v2 测试中遇到的 Connector 连接问题解析

问题背景

在使用 Wagmi v2 进行前端测试时，开发者可能会遇到一个常见的错误："Connector not connected"。这个问题通常出现在使用 useWriteContract 或 useSimulateContract 钩子时，特别是在测试环境中配置了 mock connector 的情况下。

问题表现

当开发者尝试在测试中调用 useWriteContract 钩子时，会遇到以下错误信息：

ConnectorNotConnectedError: Connector not connected.

这个错误表明，虽然测试开始时 mock connector 似乎已经连接，但在实际调用写操作时，连接状态却丢失了。从错误堆栈可以看出，问题发生在尝试获取 connector client 时。

问题原因分析

经过深入研究，我们发现这个问题可能有几个潜在原因：

1. 测试环境中的异步问题：React 组件可能在 connector 完全连接前就尝试使用它
2. 状态管理不一致：Wagmi 的内部状态可能没有正确反映测试环境中的连接状态
3. 测试配置问题：mock connector 的配置可能不完整或不正确

解决方案

对于这个问题，我们推荐以下几种解决方案：

1. 使用 Anvil 测试环境：Wagmi 官方推荐在测试中使用 Anvil 作为本地测试网络，这能提供更稳定的测试环境

2. 确保正确的测试配置：

   • 在测试前确保 connector 已完全连接
   • 使用 act 包裹可能触发状态变化的操作
   • 添加适当的等待时间让状态更新完成

3. 检查状态同步：

   • 确认测试中的状态更新是否同步
   • 检查是否有竞态条件导致连接状态丢失

最佳实践建议

为了避免这类问题，我们建议：

1. 在测试中模拟完整的连接流程，而不仅仅是设置初始状态
2. 使用官方提供的测试工具和示例作为参考
3. 考虑将复杂的合约交互测试分解为更小的单元测试
4. 在测试中添加状态变化的断言，确保预期状态确实已更新

总结

Wagmi v2 提供了强大的 Web3 交互能力，但在测试环境中使用时需要特别注意连接状态的管理。通过理解底层机制和采用正确的测试策略，开发者可以有效地避免 "Connector not connected" 这类问题，构建更可靠的测试套件。

对于更复杂的测试场景，建议参考 Wagmi 官方文档中的测试指南，并考虑使用专门的测试工具来模拟区块链环境。