web-dev-qa-db-fra.com

Rechercher l'élément par id dans react-testing-library

J'utilise react-testing-libarary pour tester mon application react. Pour une raison quelconque, je dois pouvoir trouver l'élément par id et non data-testid. Il n'y a aucun moyen d'y parvenir dans la documentation.

Existe-t-il un moyen d'y parvenir?

J'ai la sortie rendue comme:

const dom = render(<App />);

Je cherche quelque chose en ligne de:

const input = dom.getElemenById('firstinput');
//or 
const input = dom.getById('firstinput');
reactjsreact-testing-library
7
aks

J'ai trouvé un moyen de le faire.

import App from './App';
import { render, queryByAttribute } from 'react-testing-library';

const getById = queryByAttribute.bind(null, 'id');

const dom = render(<App />);
const table = getById(dom.container, 'directory-table');

J'espère que ça aide.

3
aks

Il semble que vous ayez un nœud DOM lui-même comme conteneur . Par conséquent, vous devriez pouvoir appeler .querySelector('#firstinput') avec cela.

10
Ali BARIN

Il y a deux façons de le faire

  1. Utilisez simplement container.getElementById('id'). En fin de compte, tout ce que les assistants font est de faire des requêtes comme celle-ci sous le capot
  2. Si vous souhaitez avoir votre requête personnalisée, vous pouvez écrire un rendu personnalisé. Consultez la documentation pour plus d'informations https://github.com/kentcdodds/react-testing-library#getbytestidtext-textmatch-htmlelement

Enfin, si vous pouvez éviter de rechercher des éléments par id, c'est mieux.

0
Giorgio Polvara - Gpx