web-dev-qa-db-fra.com

react-testing-library pourquoi toBeInTheDocument () n'est pas une fonction

Quelqu'un peut-il m'aider s'il vous plaît, je suis vraiment coincé là-dessus. Voici mon code pour une info-bulle qui bascule l'affichage de la propriété css: bloc sur MouseOver et sur l'affichage Mouse Out: aucun

 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()
  })

Je reçois toujours l'erreur TypeError: attendez (...). ToBeInTheDocument n'est pas une fonction

Quelqu'un at-il une idée de pourquoi cela se produit? Mes autres tests pour rendre et prendre un instantané du composant fonctionnent tous comme prévu. Comme le font queryByText et queryByTestId.

Merci

reactjsreact-testing-library
10
dorriz

toBeInTheDocument ne fait pas partie de RTL. Vous devez installer jest-dom pour l'activer.

17
Giorgio Polvara - Gpx

Comme mentionné par Giorgio, vous devez installer jest-dom. Voici ce qui a fonctionné pour moi:

(J'utilisais TypeScript)

npm i --save-dev @testing-library/jest-dom

Ajoutez ensuite une importation à vos setupTests.ts

import '@testing-library/jest-dom/extend-expect';

Ensuite, dans votre jest.config.js, vous pouvez le charger via:

"setupFilesAfterEnv": [
    "<rootDir>/src/setuptests.ts"
  ]
3
Jafin