Questions sur le test des composants React avec l'utilitaire react-testing-library.

react-testing-library...

Actuellement, j'écris un test pour tester le contenu qui se trouve à l'intérieur (contenu HTML), mais il semble que je ne puisse pas le tester correctement avec la bibliothèque de test React. Il peut trouver la valeur id de cela, mais comment obtenir le contenu HTML à l'intérieur de cet élément. i....
Je teste un composant React import React from 'react'; import styled from 'styled-components'; const Input = styled.input``; export default function FormInput (props) { const { name, type, value, label, placeholder, onChange} = props; return ( <Input id={name} name={nam....
16 mai 2020 à 06:02
Je veux tester si le composant envoie une action au magasin, pour cela, je dois me moquer des fonctionnalités de React Hooks. J'utilise le crochet useDispatch pour obtenir la fonction de répartiteur et la mettre à l'intérieur d'une variable afin que je puisse l'appeler. Lorsque j'exécute mes combina....
Lorsque je teste des composants avec React Testing Library, je commence par getBy*, et j'ai parfois besoin de le remplacer par queryBy* (par exemple si j'ai besoin de vérifier la non-existence d'un élément). Mes tests se terminent par un mélange de getBy et queryBy, et je viens récemment d'utiliser ....
Je n'ai pas trouvé de moyen de simuler le clic d'un élément dans le composant enfant du fichier de test parent. let card; const displayCardSection = (cardName) => { card = cardName; }; describe('Parent component', () => { it('simulate click event on child link', () => { const component = m....
J'écris un test simple en utilisant react-native-testing-library (mes premiers pas avec cette bibliothèque) dans mon application expo native react. Mais j'obtiens une erreur confuse venant de quelque part dans la base de code react-native elle-même. Soit il y a un problème avec mon code, soit il y a....
23 juil. 2019 à 10:31
J'ai un composant React qui génère un bouton, dont le contenu contient un élément <span> comme celui-ci: function Click(props) { return ( <button disable={props.disable}> <span>Click me</span> </button> ); } Je veux tester la logique de ce composant avec l'utilis....
14 juin 2019 à 10:56
Je teste un composant où si ItemLength = 1, render renvoie null. const { container, debug } = render(<MyComp ItemLength={1} />); Lorsque j'appelle debug() dans mon test, il affiche un <div />. Comment vérifier que le composant renvoie un div vide dans mon test?....
23 mai 2019 à 05:31
J'apprends les tests unitaires des composants React à l'aide de react-testing-library J'ai le rendu du composant correctement, cependant, lorsque je vise à diviser le test en petits morceaux à l'intérieur d'une fonction describe(). Le test se rompt et voici pourquoi. Actuellement, seul l'un ou l'aut....
Solution de travail actuelle En utilisant ce html: <p data-testid="foo">Name: <strong>Bob</strong> <em>(special guest)</em></p> Je peux utiliser la méthode React Testing Library getByTestId pour trouver la {{X1 }}: expect(getByTestId('foo').textContent).toEqual('Name: Bob (special guest)') Y a-t-....
J'essaye de tester l'événement onChange d'un Select component à l'aide de react-testing-library. J'attrape l'élément en utilisant getByTestId qui fonctionne très bien, puis je règle la valeur de l'élément puis j'appelle fireEvent.change(select); mais le onChange n'est jamais appelé et l'état n'est j....
15 mars 2019 à 16:47
J'utilise Cypress avec Cypress Testing Library pour tester mon application React. J'ai une entrée avec un nom ('Steve') comme valeur et j'essaie de la trouver avec un cyprès comme ceci: // In the component: <input defaultValue="steve" /> // In the spec file: cy.getByText(/steve/i).should('exist'); ....
J'obtiens Warning: An update to App inside a test was not wrapped in act(...). dans ma suite de tests chaque fois que je fais une requête API et que je mets à jour l'état. J'utilise la bibliothèque react-testing. J'ai également essayé d'utiliser les outils de test ReactDOM, j'ai obtenu le même résul....
18 févr. 2019 à 16:59
Je suis en train de passer à react-testing-library, et je ne sais pas comment déclencher cet événement et obtenir les résultats des modifications. J'ai essayé d'utiliser la fonction fireEvent pour déclencher le changement, puis j'ai essayé la fonction rerender, mais je n'arrive pas à la faire foncti....
15 févr. 2019 à 03:46
Je suis totalement nouveau dans les tests JavaScript et je travaille dans une nouvelle base de code. Je voudrais écrire un test qui vérifie un nom de classe sur l'élément. Je travaille avec Jest et react-testing-library. Ci-dessous, j'ai un test qui rendra un bouton basé sur l'accessoire variant. Il....
On dirait que la façon dont Material UI fonctionne est qu'elle rend un SVG différent lorsque la case est cochée, et ne change pas les attributs ou quoi que ce soit sur l'élément d'entrée réel. Alors, comment tester réellement que l'élément est vérifié conformément à la philosophie react-testing-libr....
13 nov. 2018 à 02:36
J'utilise react-testing-libarary pour tester mon application de réaction. Pour une raison quelconque, je dois être en mesure de trouver l'élément par id et non par 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: co....
26 oct. 2018 à 10:27