No tienes acceso a esta clase

¡Continúa aprendiendo! Únete y comienza a potenciar tu carrera

Wrapper: probando elementos y estados

8/14
Recursos

Aportes 2

Preguntas 2

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad?

La doc de la API de Wrapper para vue-test-utils

Wrapper: probando elementos y estado

.
wrapper.vm es una propiedad proporcionada por vue-test-utils que permite acceder a la instancia del componente Vue encapsulado por el wrapper.
.
La instancia del componente Vue proporciona acceso a todas las propiedades, métodos y eventos definidos en el componente, lo que permite realizar pruebas más avanzadas y detalladas. Al acceder a la instancia del componente Vue a través de wrapper.vm, podemos interacturar con ella directamente y realizar comprobaciones sobre su estado y comportamiento.
.
A continuación se muestra algunos ejemplos de lo que se puede hacer con wrapper.vm:

  • Acceder y modificar las propiedades del componente Vue.
// Acceder a una propiedad
const propValue = wrapper.vm.myProp;

// Modificar una propiedad
wrapper.vm.myProp = 'new value';
  • Llamar a los métodos del componente Vue.
// Llamar a un método sin argumentos
wrapper.vm.myMethod();

// Llamar a un método con argumentos
wrapper.vm.myMethod('arg1', 'arg2');
  • Disparar eventos en el componente Vue.
// Disparar un evento en el componente Vue
wrapper.vm.$emit('my-event', eventData);
  • Acceder al estado del componente.
// Acceder al estado del componente Vue
const myState = wrapper.vm.$data.myState;
  • Realizar aserciones sobre el estado o la salida del componente Vue.
// Comprobar que una propiedad del componente Vue tenga un valor específico
expect(wrapper.vm.myProp).toBe('expected value');

// Comprobar que un método del componente Vue devuelve un valor esperado
expect(wrapper.vm.myMethod()).toBe('expected value');

// Comprobar que el componente Vue ha emitido un evento específico
expect(wrapper.emitted('my-event')).toBeTruthy();

// Comprobar que el componente Vue ha actualizado su estado correctamente
expect(wrapper.vm.$data.myState).toBe('expected value');

.
En resumen, wrapper.vm proporciona acceso directo a la instancia del componente Vue encapsulado por el wrapper, lo que permite interacturar con él directamente y realizar pruebas avanzadas y detalladas sobre su estado y comportamiento.