我正在尝试测试 Material UI Drawer。当您按 Esc 键或单击抽屉外部时,它应该关闭。但它失败了。
我正在使用反应测试库进行测试。我创建了一个codesandbox,并且也在使用React 16.9.0。
我遇到了同样的问题,我解决它的方法是确保“Escape”键冒泡。另外,为了使您的测试更容易,请为列表内容指定
datat-testid
。您可以称其为data-testid="list-component"
这是基于您的代码的测试示例:
it('closes drawer on escape key', () => {
// render
const { queryByTestId } = render(<TemporaryDrawer />);
// open drawer
fireEvent.click(queryByTestId('right-btn'));
expect(queryByTestId('list-component')).toBeInTheDocument();
// close drawer
fireEvent.keyDown(queryByTestId('list-component'), { key: 'Escape', bubbles: true });
expect(queryByTestId('list-component')).not.toBeInTheDocument();
});