Closed khukhunaishvili closed 3 years ago
Hi! Can you share an example of the component and the test, and some information about the Vue Testing Lib version?
If $getRouteQuery
is a custom method provided by a plugin or similar you might need to install that plugin when rendering the component, too.
@afontcu
package.json
"@testing-library/jest-dom": "^5.11.9",
"@testing-library/vue": "^5.6.1",
component:
<template>
<div>
<h1 v-if="isMainFaq">Main Faq</h1>
</div>
</template>
<script>
export default {
computed: {
isMainFaq() {
return this.$getRouteQuery().length == 1
},
},
}
</script>
faq.specs.js
import { render, screen } from '@testing-library/vue'
import '@testing-library/jest-dom'
import faq from '../../src/components/TC/layout/faq/index.vue'
const routes = [
{path: '/faq', component: faq},
]
it('Faq component', async () => {
render(faq, {routes});
expect(screen.queryByText('Text')).not.toBeInTheDocument()
expect(screen.getByText('faq')).toBeInTheDocument()
})
I have also tried to registering my method ( which is defined in my_plugin.js
) as i did it in main.js, but it gives me bunch of different errors.
import MyPlugin from '../../src/my_plugin'
Vue.use(MyPlugin)
Not sure where $getRouteQuery
comes from, but assuming "MyPlugin" provides it…:
import MyPlugin from '../../src/my_plugin'
it('Faq component', async () => {
render(faq, {routes}, vue => { vue.use(MyPlugin) }); // this changed
expect(screen.queryByText('Text')).not.toBeInTheDocument()
expect(screen.getByText('faq')).toBeInTheDocument()
})
Yes, $getRouteQuery
is defined in MyPlugin.
Thank you, it is working.
I have a Vue cli project and for testing using Vue testing library & Jest dom.
Iv a method on Vue prototype which works fine in component.
While trying to test that component, i get this message - "TypeError: this.$getRouteQuery is not a function"
How can i fix it?