javascript - React-testing-library 为什么 toBeInTheDocument() 不是一个函数

Question

这是我的工具提示代码，用于在 MouseOver 和 Mouse Out 上切换 CSS 属性 display: block display: none。

 it('should show and hide the message using onMouseOver and onMouseOut events respectively', () => {
    const { queryByTestId, queryByText } = render(
      <Tooltip id="test" message="test" />,
    )
    fireEvent.mouseOver(queryByTestId('tooltip'))
    expect(queryByText('test')).toBeInTheDocument()
    fireEvent.mouseOut(queryByTestId('tooltip'))
    expect(queryByText('test')).not.toBeInTheDocument()
    cleanup()
  })

我不断收到错误 TypeError:expect(...).toBeInTheDocument 不是函数

有人知道为什么会发生这种情况吗？我对组件进行渲染和快照的其他测试都按预期工作。 queryByText 和 queryByTestId 也是如此。

Answer 1

toBeInTheDocument 不是 RTL 的一部分。您需要安装jest-dom启用它。

然后通过以下方式将其导入到您的测试文件中:

import '@testing-library/jest-dom'