Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

How to test functions inside functional component and also using hooks values

Abierto
  • ¿Algo no está bien?
#1,382 1 comentario 1 reacción 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
25/100
Tipo de issue
Documentación
Claridad
Necesita aclaración
Estado de actividad
Estancado
Stack tecnológico
react, typescript
Área
frontend, testing

Línea de trabajo

El ejemplo está en Employee.tsx y hace referencia a useEmployeeDetails, useEmployeeData y useCleanData, pero no se indica ninguna prueba del repositorio ni ninguna ruta de origen. Empieza por localizar esos hooks y el componente Employee, y determina después el comportamiento visible para el usuario que desencadena el botón de actualización. Se necesitan un resultado esperado concreto y una ubicación para la prueba antes de poder definir el alcance del trabajo.

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

Descripción

Hello

I will try to explain the case in the simplest way that I could:

I have a component: Employee.tsx

It has a pseudo code like this:

const Employee = () => {

   const { name, status } = useEmployeeDetails();
    const { updateEmployeeInfo } = useEmployeeData(();
    const { clearStorage} = useCleanData();

    const generalUpdate = async() => {
          await updateEmployeeInfo(name, status);
           clearStorage();
    }

    return(
            <>
               <span>update</update>
               <button onClick={generalUpdate}></button>
           </>
           )

}

I am trying to write a test for 'generalUpdate' function that contains async function (updateEmployeeInfo) that is using hooks data as parameters, also I want to have a way how to access or spy on this function to be able to manipulate it and test different scenarios.

So :
1- How to access a function inside a functional component.
2- how to mock this function, especially if it is using another async function in its implementation?

Basically testing a function that is using data from hooks (or using async function inside it) and it exists inside a functional component

I hope my explanation is clear 😄

Lenguaje dominante
JavaScript
Estrellas
19.7k
Forks
1.2k
Sin PR fusionados en 30 d

Preparar el entorno

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.

Más de testing-library/react-testing-library

Todos los issues de testing-library/react-testing-library

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.