Lecciones del curso
Testing en React con Jest y testing-library
Instalando Jest en nuestro proyecto
20m
Básicos de Jest
Matchers segunda parte
Números
Arrays
Async
Mocks primera parte
Mocks segunda parte
Mocks tercera parte
Testing sexta parte
Testing séptima parte
Matchers primera parte
Testing en Create React app
Explorando react-testing-library
Explorando testing-library/jest-dom
Detonando eventos con testing-library
Testing con snapshots
11m
Explorando el proyecto
Testeando nuestro primer componente con redux parte 1
Testeando nuestro primer componente con redux parte 2
Testing de actions creators y thunks (acciones asíncronas)
Testing reducers
Mock Avanzado: Peticiones http con msw.js
21m
Mock axios
Router primera parte
Router segunda parte
Router tercera parte
Router cuarta parte
Instalando jest
Para esta lección vamos a instalar y configurar jest en un proyecto simple hecho por nosotros desde cero, tranquilo, será un proyecto muy sencillo.
Nota: De aquí en adelante asumiremos que ya tienes instalado nodejs, de no ser así, puedes descargarlo aquí, sin embargo, te sugerimos intalarlo mediante nvm, un manejador de versiones de nodejs.
Creando el proyecto
Nuestro proyecto estará construido de la siguiente manera:
- Crearemos una carpeta donde estarán todo los archivos de nuestro proyecto con el comando
mkdir
, en mi caso lo nombraré comojest-basics
. - Con el comando
yarn init
onpm init
crearemos un package.json. - Crearemos un archivo llamado
app.test.js
dentro nuestra carpeta y a la misma altura de nuestropackage.json
.
Hasta este momento debemos tener una estructura como esta:
.
└── jest-basics/
├── package.json
└── app.test.js
Una vez creado nuestro proyecto comenzaremos la configuración, a continuación los comandos y código que usaremos.
Instalación de jest
// yarn
$ yarn add -D jest
//npm
$ npm i -D jest
package.json scripts
{
// ...package.json config
"scripts": {
"test": "jest --watchAll"
}
}
Pueden encontrar el repo en github aquí