reactjs / reactjs/react.dev

Improve/create documentation for ReactTestUtils.renderIntoDocument()

Ouverte
#28 3 commentaires 4 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

difficulty: beginner good first issue type: documentation
Langage dominant
JavaScript
Étoiles
11.8k
Forks
7.9k
Merge moyen
1 j 11 h
PR mergées (30 j)
11

Description

This issue was originally reported by @the-spyke via facebook/react/issues/10330

There is almost none documentation about how to actually use .renderIntoDocument() method. I can't find find answers on those questions on Jest's website or enzyme's (I know that it's not Facebook) either.

  • If I render a component into a DOM in a test, how will it be destroyed?
  • Should I clean up by myself?
  • What tools to use for this?
  • Just .unmountComponentAtNode()?
  • Where I will get the container to pass in?
  • What about additional component trees like in Popovers?
  • What are the best ways to test that there aren't any parts left after my component were unmounted?

It will be nice to see such information before people will met memory leaks in their tests, and also help to establish good practices for writing tests.

Additional notes:

  • Calling .renderIntoDocument() returns you an instance
  • This instance was rendered into freshly created DOM element, which now represents a detached tree
  • There's also a reference to the instance in ReactDOM's internal map
  • So, even if you remove all your references to this instance, on every call to .renderIntoDocument() you will get 1 detached tree hanging in memory + 1 instance of a React component with all its props not available for garbage collection

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez par la documentation liée de Test Utils concernant renderIntoDocument() et examinez le point d’entrée associé unmountComponentAtNode(). Documentez comment l’arbre DOM détaché et l’instance du composant sont nettoyés, d’où provient le conteneur, comment les arbres supplémentaires sont gérés et comment les tests peuvent vérifier le nettoyage.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
javascript, react
Domaine
documentation
Type d'issue
Documentation
Difficulté
3/5
Temps estimé
1-2 jours
Activité
Calme
Clarté
Plutôt claire
Accessibilité débutants
42/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.