Francisco Javier Martinez 21/03/2018 Videotutorial, Vue.jsComentarios desactivados en Comprobar eventos emitidos desde un componente hijo hacia el padre con vue-test-utils
En videos anteriores hemos aprendido a probar una comunicación descendente entre componentes. Nos referimos al paso de props desde el componente padre hacia el hijo. En este video nos centraremos en la comunicación ascendente, es decir, a la emisión de eventos desde el componente hijo para que el componente padre actue en consecuencia. Haremos uso de la función emitted del wrapper para comprobar qué eventos han sido emitidos.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 21/03/2018 Videotutorial, Vue.jsComentarios desactivados en Sustituyendo la implementación de componentes con stubs y shallow con vue-test-utils
En ciertas ocasiones necesitamos que al montar un componente hijo, éste sea sustituido por otro, o simplemente dejarlo sin comportamiento para poder probar el componente padre en completo aislamiento. En esta lección aprenderemos a hacerlo a través de la opción stubs del objeto de configuración de mount. También explicaremos la diferencia entre utilizar shallow en lugar de mount para montar nuestro wrapper.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 15/03/2018 Videotutorial, Vue.jsComentarios desactivados en Probando paso de props entre componentes con vue-test-utils
En la lección anterior aprendimos a comprobar que un componente padre muestra un componente hijo. En la mayoría de ocasiones no nos basta con probar su simple existencia, sino que también necesitamos comprobar que un componente se comunica de manera correcta con otro. En este video veremos cómo probar que las props que esperamos recibir se renderizan correctamente en el hijo y de igual manera que las props que esperamos se pasen desde el padre sean las correctas.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 15/03/2018 Videotutorial, Vue.jsComentarios desactivados en Comprobar que un componente padre renderiza un componente hijo con vue-test-utils
Para iniciar esta segunda parte del curso aprenderemos a comprobar que un componente padre contiene un componente hijo. Crearemos un componente ToDoList y nos aseguraremos de que se renderizan tantos componentes Task como elementos tengamos en nuestro arreglo de tareas. Los métodos del wrapper que aceptan selectores de CSS como contains, find, findAll etc. también admiten como parámetro un componente de Vue, esto nos servirá para cumplir con nuestro cometido.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 07/03/2018 Videotutorial, Vue.jsComentarios desactivados en Pruebas usando los métodos isVisible(), is(), isEmpty() y classes() de vue-test-utils
Para terminar con esta primera parte del curso vamos a realizar un recorrido por las funciones básicas que nos faltan por ver del wrapper . Estas funciones son isVisible(), is(), isEmpty() y classes(). En la siguiente parte de este curso veremos con detalle las funciones que tienen que ver con la comunicación entre componentes.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 07/03/2018 Videotutorial, Vue.jsComentarios desactivados en Uso de los métodos findAll(), exists() y contains() de vue-test-utils
A veces es necesario encontrar varios elementos del mismo tipo para realizar comprobaciones a un conjunto, esto lo conseguiremos usando la función findAll() como veremos en esta lección, donde también introduciremos ciertos condicionales para renderizar elementos basándonos en estados de la aplicación, lo que nos llevará al uso de funciones como exists() y contains().
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 07/03/2018 Videotutorial, Vue.jsComentarios desactivados en Pruebas de Computed Properties y métodos con Vue.js y vue-test-utils
En esta lección veremos cómo comprobar que una computed property se esté mostrando en el lugar correcto y que un método sea invocado en el momento esperado. Haremos uso por primera vez del objeto de configuración de mount que nos permitirá sobrescribir propiedades de nuestro componente. También veremos un caso de uso para la función fn de Jest, que nos será de utilidad para hacer mock de métodos y realizarles comprobaciones.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 06/03/2018 Videotutorial, Vue.jsComentarios desactivados en Métodos find(), trigger(), html() y text() de vue-test-utils
vue-test-utils es una API basada en un wrapper. Un wrapper es un objeto que contiene un componente montado y métodos para probarlo. En este video veremos cómo utilizar los métodos find, trigger, html y text. También haremos uso del objeto vm. Este objeto está solo disponible cuando el wrapper es un componente Vue y da acceso a todo lo que existe dentro de nuestro componente.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 06/03/2018 Videotutorial, Vue.jsComentarios desactivados en Configuración de babel-jest y uso de mount
De la misma manera que tuvimos que instalar un preprocesador para transpilar ficheros .vue, ahora vamos a necesitar otro para transpilar sintaxis ES6 en nuestras pruebas. De esta forma podremos importar módulos y hacer uso de las nuevas funcionalidades que las últimas versiones de JavaScript nos brindan.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Francisco Javier Martinez 06/03/2018 Videotutorial, Vue.jsComentarios desactivados en Instalación de Jest y vue-test-utils
En este video vamos a realizar la instalación de Jest y de vue-test-utils, componentes que nos permitirán comenzar a escribir nuestras pruebas. Además escribiremos una primera prueba muy sencilla y una vez que todo esté listo, pasaremos a la siguiente lección donde comenzaremos a escribir nuestras pruebas para los componentes de Vue.
Regístrate para ver ésta y cientos de lecciones exclusivas.
Styde usa cookies para guardar tus preferencias y para seguimiento anónimo AceptarLeer más
Privacy & Cookies Policy
Privacy Overview
This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary cookies are absolutely essential for the website to function properly. This category only includes cookies that ensures basic functionalities and security features of the website. These cookies do not store any personal information.
Any cookies that may not be particularly necessary for the website to function and is used specifically to collect user personal data via analytics, ads, other embedded contents are termed as non-necessary cookies. It is mandatory to procure user consent prior to running these cookies on your website.
