La inteligencia artificial se ha vuelto una aliada poderosa para escribir pruebas en React, y aprender a usarla con un buen prompt engineering puede ahorrarte horas frente al editor. Si sabes guiarla, ChatGPT te ayuda a generar casos de prueba para tus componentes y a entender tests existentes sin perder el control técnico.

¿Cómo aprovechar la IA para escribir tests en React?

Hay dos escenarios donde la IA brilla en el flujo de testing. El primero es cuando vas a crear pruebas desde cero: le pasas el componente, escribes un prompt claro y ella te devuelve los casos de prueba que necesitas. El segundo es cuando te enfrentas a archivos de test que ya existían en un proyecto y quieres entender qué hacen; basta con pegar el código y pedir una explicación.

¿La IA reemplaza el conocimiento de testing? No. Es una herramienta más en tu arsenal. Si no sabes leer un test, no podrás detectar cuándo la IA se equivoca.

¿Qué prompt usar para generar tests con ChatGPT?

La especificidad lo es todo. Un prompt genérico tipo "hazme el test de esto" devuelve respuestas inservibles. En cambio, uno bien construido define el rol, las herramientas y la intención [01:08]:

• Actúa como un desarrollador front-end con experiencia en testing de React.
• Usa React Testing Library como librería de pruebas.
• Usa Vitest como test runner.
• Indica que recibirás un componente y necesitas casos de prueba.

Después pegas el componente y dejas que la IA trabaje. En el ejemplo con la aplicación Platzi Orders, se usó el componente OrderItem, que no tenía pruebas previas.

¿Qué pasa cuando la IA genera un test que falla?

Aquí es donde se nota quién entiende testing y quién no. Al correr yarn test sobre el archivo OrderItem.test.tsx generado por ChatGPT, pasaron seis pruebas y falló una [02:30]. La prueba should display the payment method correctly formatted esperaba el texto creditCard en minúscula, pero el DOM lo renderizaba en mayúscula porque el componente aplicaba un replace sobre order.paymentMethod.

La solución fue revisar tres lugares clave:

1. El componente real para ver cómo transforma el dato.
2. El mock que creó la IA para verificar el valor de entrada.
3. El DOM renderizado para confirmar la salida exacta.

Copiar el valor real que retorna el DOM y reemplazarlo en la aserción dejó la prueba en verde.

¿Por qué la IA se equivoca en los tests? Porque no ejecuta tu código. Asume comportamientos a partir del componente, pero detalles como transformaciones de strings o mocks específicos requieren tu validación.

¿Qué ventajas tiene usar IA en testing más allá de ahorrar tiempo?

La IA no solo acelera la escritura, también te muestra casos que no habías contemplado. Tú puedes pensar en probar tres escenarios, pero ChatGPT puede sugerirte siete, incluyendo edge cases que enriquecen tu cobertura. Funciona como un tutor disponible las 24 horas que te enseña a mejorar tus pruebas con cada interacción.

Eso sí, todo lo que la IA te entregue debe pasar por tu criterio. Lee siempre las explicaciones que acompañan al código, valida los mocks, ejecuta los tests y corrige lo que falle. Esa combinación entre prompt engineering bien hecho y comprensión técnica es la que convierte a la IA en un acelerador real de tu trabajo.

¿Has probado generar tests con ChatGPT en tus proyectos React? Cuéntame en los comentarios qué prompts te han dado mejores resultados.