排毒：检查Toast是否被调用

Question

我正在使用带有“错误”或“成功”类型的 Expo 的 React Native 应用程序中的“react-native-toast-message”中的 Toast

Toast.show({
  type: 'error',
  text1: 'An error occurred')
});

如何检查使用 Detox 实施的 e2e 测试是否显示 Toast？

检查 testID 的可见性？

我们可以在Toast组件中设置一个testID来检查可见性吗？ 我尝试使用从 Toast 'config' 属性设置的自定义布局。但没有成功。

export const toastConfig = {
  /*
    Overwrite 'success' type,
    by modifying the existing `BaseToast` component
  */
  success: (props) => (
    <BaseToast
      {...props}
      testID="Toast.success" // not found by detox
    />
  ),...

嘲笑它？

我已经阅读了关于 “Mocking” with detox 的文档。但这需要使用在“start”调用 React Native 期间使用“--sourceExts”参数添加的模拟文件扩展名。或配置 Metro 捆绑器。 这是我们可以通过世博会做的事情吗？

任何帮助表示赞赏。

Answer 1

临时解决方案

由于react-native-toast-message库内部使用了Detox，因此它有自己的testID。通过查看

源代码，我注意到它使用“toast”+ componentId 格式，允许我们定位像“toastText1”这样的元素，例如：

await waitFor(element(by.id('toastText1')))
  .toBeVisible()
  .withTimeout(2000);

这不是一个理想的解决方案，因为这些 ID 仅供 toast 消息项目内部使用。它们不应该暴露，并且将来可能会发生变化，从而可能导致我们的 E2E 测试失败。