Test onOk / onCancel | Ant Design [antd]

Question

是否有任何方法来测试onOk和onCancel ?我已经尝试使用fireEvent.keyDown测试onCancel但是它不像我期望的那样工作。

<>
<AntdModal
data-testid="modal-window"
width={583}
visible={visible}
onOk={() => setVisible(false)}
onCancel={() => setVisible(false)}
closable={false}
header={null}
footer={null}
>
<span className="modal-header">
{headerText}
</span>
{children}
</AntdModal>
</>

我想测试这个的主要原因是我需要覆盖80%以上的测试…

报道结果

* .test.js:

it('should modal disappear after cancel click', async () => {
const { container } = render(
<ModalWindow headerText="header" setVisible={jest.fn} visible>
<div>children</div>
</ModalWindow>,
);
const modal = screen.getByTestId('modal-window');
expect(modal).toBeInTheDocument();
fireEvent.keyDown(container, {
key: 'Escape',
code: 'Escape',
keyCode: 27,
charCode: 27,
});
await waitFor(() => {
expect(modal).not.toBeInTheDocument();
});
});

Answer 1

如果只是关于代码覆盖率(在您的情况下是关于代码气味)，我建议将() => setVisible(false)声明为常量。这将减少(可能产生bug的)代码重复，并且您将不需要在代码中测试外部库。