首页 > 解决方案 > react-testing-library 为什么 toBeInTheDocument() 不是函数

问题描述

display: block这是我在 MouseOver 和 Mouse Out 上切换 CSS 属性的工具提示代码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 is not a function

有没有人知道为什么会这样?我用于渲染和快照组件的其他测试都按预期工作。与 queryByText 和 queryByTestId 一样。

标签: javascriptreactjsunit-testingjestjsreact-testing-library

解决方案


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

然后通过以下方式将其导入您的测试文件: import '@testing-library/jest-dom'


推荐阅读