reactjs / reactjs/react.dev

Improve/create documentation for ReactTestUtils.renderIntoDocument()

Abierto
#28 3 comentarios 4 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

difficulty: beginner good first issue type: documentation
Lenguaje dominante
JavaScript
Estrellas
11.8k
Forks
7.9k
Merge medio
1 d 11 h
PR fusionados (30 d)
11

Descripción

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

Guía de contribución

Abrir la guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Línea de trabajo

Comienza con la documentación enlazada de Test Utils para renderIntoDocument() y revisa el punto de entrada relacionado unmountComponentAtNode(). Documenta cómo se limpian el árbol DOM desacoplado y la instancia del componente, de dónde procede el contenedor, cómo se gestionan los árboles adicionales y cómo las pruebas pueden verificar la limpieza.

Escrito por el modelo de indexación a partir del texto del issue.

Evaluación

Stack tecnológico
javascript, react
Área
documentation
Tipo de issue
Documentación
Dificultad
3/5
Tiempo estimado
1-2 días
Estado de actividad
Tranquilo
Claridad
Bastante claro
Aptitud para principiantes
42/100

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.