vue-awesome-swiper
vue-awesome-swiper copied to clipboard
trying to test vue-jest vue-cli errors out
this is the test suit
import { mount, createLocalVue } from '@vue/test-utils'
import Vuetify from 'vuetify'
import Vuex from 'vuex'
import ChainsSwiper from '@/components/ligandability/ChainsSwiper'
import { directive } from 'vue-awesome-swiper'
import 'swiper/css/swiper.css'
const localVue = createLocalVue()
localVue.use(Vuetify)
localVue.use(Vuex)
let wrapper, vuetify, store
const factory = options => {
return mount(ChainsSwiper, {
...options,
localVue,
propsData: {
selected: 0
}
})
}
beforeEach(() => {
vuetify = new Vuetify()
store = new Vuex.Store({
modules: {
global: {
state: {
baseUrl: '/root'
}
}
}
})
wrapper = factory({ vuetify, store })
console.log('wrapper', wrapper)
})
afterEach(() => wrapper.destroy())
The ChainsComponent is using on mounted hook the 'slideTo(0)' but that errors out as well
<template>
<div
v-swiper:chainSwiper="swiperOption"
class="elevation-4 grey lighten-5 border--radius-3"
>...
TypeError: Cannot read property 'slideTo' of undefined
204 | },
205 | mounted() {
> 206 | this.chainSwiper.slideTo(this.selected)
| ^
207 | },
What is Expected?
wrapper to be mounted as a Vue Instance
What is actually happening?
console.error node_modules/vue/dist/vue.runtime.common.dev.js:621
[Vue warn]: Error in render: "TypeError: Cannot read property 'params' of undefined"
found in
I am not sure what is happening here anymore since the 'params' come from the swiper components but they don't seem to be passed on as they should by the custom directive required.
Also it doesn't work with simply mounting the VueAwesomeSwiper neither
I am at a loss unless you have some recommendations on how to proceed
Any solution for it ?