DEV Community
·
如何通过序列化器移除快照中的动态值
💡
原文英文，约600词，阅读约需2分钟。
📝
内容提要
Jest和Vitest的快照测试可检测代码输出的意外变化，但动态值（如ID和时间戳）可能导致快照失败。通过自定义序列化器，可以用占位符替换这些动态值，从而保持快照一致性。可以创建可重用的解决方案来处理多个动态属性，并使用npm包简化操作，确保类型安全。
🎯
关键要点
- Jest和Vitest的快照测试用于检测代码输出的意外变化。
- 动态值（如ID和时间戳）可能导致快照测试失败。
- 可以通过自定义序列化器用占位符替换动态值，以保持快照一致性。
- 自定义序列化器需要实现test()和serialize()两个函数。
- 可以创建可重用的解决方案来处理多个动态属性。
- 使用npm包snapshot-serializers可以简化序列化器的使用。
- 提供类型安全的API来替换或移除快照中的属性。
❓
延伸问答
如何通过序列化器处理快照中的动态值？
可以通过自定义序列化器用占位符替换动态值，以保持快照一致性。
自定义序列化器需要实现哪些函数？
自定义序列化器需要实现test()和serialize()两个函数。
使用npm包snapshot-serializers有什么好处？
使用snapshot-serializers可以简化序列化器的使用，并提供类型安全的API。
如何创建可重用的序列化器？
可以创建一个函数，接受属性名和占位符，返回一个序列化器对象，从而处理多个动态属性。
快照测试中动态值会导致什么问题？
动态值如ID和时间戳会导致快照测试失败，因为每次测试运行时这些值都会不同。
如何在快照中移除某个属性？
可以使用removeProperty函数来完全移除快照中的某个属性。
➡️
