Is there a way to test Ant Design Modal parameter methods?

user_3885758 0
Viewed 465

I am currently trying to test the 'onOk' and 'onCancel' methods following snippet of code with jest and enzyme:

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

This is within a helper method called in a component. I've tried waiting for the component to update and then query the OK button but enzyme can't seem to find it. When I do a debug() on the component, the modal doesn't show up either. Is there a good way to spy on these methods or even invoke them in the first place? Thanks!

antd enzyme jestjs reactjs
1 Answers

the only way i was able to do this is following the test from Ant design for their own Modal.confirm, this how i managed to do it

i have a button that trigger a function that calls 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') will return two items the first is the cancel and the second is the ok button, then after that click trigger i was able to check if my function has been called via a jest spy

expect(taskDeleteSpy).toHaveBeenCalledTimes(1);
user_53797840
Related