Comencemos nuestras pruebas unitarias, usaremos mocha para el lenguaje de pruebas y fixture de open-wc para renderizar el componente. También usaremos sinon para stubs y fakes
Como podéis ver, He creado un pseudo renderizador dentro de
Vamos a los casos de prueba reales
- Prueba si la tarjeta tiene una clasificación de película adecuada
Estaremos probando la siguiente línea con la entrada dada
<div class="movie__rating">${movie.vote_average}</div>
Nuestro caso de prueba va como sigue
- Obtener el elemento o shadowRoot del renderizador de accesorios. Principalmente pruebo sobre el renderizador de sombras
- comprobar si el elemento contiene la salida esperada
Así que estamos esperando que la calificación de la película sea 7.2, por lo que según nuestra entrada dada, el caso de prueba debería tener éxito. Puede probar suministrando una entrada diferente.
Ahora ejecute npm run test para comprobar y probar la cobertura
2. Comprobar que el título de la película es correcto
3. Comprobar que el cartel de la película es correcto
4. Negativo: Comprobar que no tiene el cartel de la película
Así llegamos al final para probar nuestro componente web de presentación, en la siguiente parte pasaremos a probar los componentes con estado y lo más importante las pruebas de eventos personalizados.
Aquí está nuestro código final