时间戳

首页 > 解决方案 > 有没有办法测试 Ant Design Modal 参数方法？

reactjs - 有没有办法测试 Ant Design Modal 参数方法？

问题描述

我目前正在尝试使用玩笑和酶的代码片段测试“onOk”和“onCancel”方法：

Modal.confirm({
title: 'Role Change',
content: `Change?`,
okText: 'Change',
onOk: method1,
onCancel: method2
  })

这是在组件中调用的辅助方法中。我试过等待组件更新，然后查询确定按钮，但酶似乎找不到它。当我在组件上执行 debug() 时，模态也不显示。有没有一种很好的方法来监视这些方法，甚至首先调用它们？谢谢！

标签： reactjsjestjsenzymeantd

解决方案

我能够做到这一点的唯一方法是遵循 Ant design 对他们自己的 Modal.confirm 的测试，这就是我设法做到的

我有一个按钮可以触发调用 Modal.confirm 的函数

const wrapper = mount(
  <MyComponent/>,
);
jest.useFakeTimers();
const button = wrapper
  .findWhere(node => node.key() === 'btnDeleteTask')
  .find('button');
button.simulate('click');
jest.runAllTimers();
jest.useRealTimers();
document.body.querySelectorAll('.ant-btn')[1].click();

document.body.querySelectorAll('.ant-btn') 将返回两个项目，第一个是取消，第二个是确定按钮，然后在单击触发器之后，我能够检查我的函数是否已通过开玩笑间谍被调用

expect(taskDeleteSpy).toHaveBeenCalledTimes(1);

推荐阅读