0

I have a Nuxt project containing a test file under test/index.test.js and I'm trying to test individual components by mounting them like so:

import { Index } from './../pages/Index.vue'
import { mount } from '@vue/test-utils'

test.beforeEach(() => {
    const wrapper = mount(Index)
    console.log('Wrapper: ' + wrapper)
}

Which gives me the following error when running the ava command line:

SyntaxError: /weather-app/pages/Index.vue: Unexpected token (1:0)
1 | <template>

How may I test individual components and their methods using the Ava test runner? What's the issue here?

Christopher
  • 1,712
  • 2
  • 21
  • 50
  • Have you tried importing Index as default? I've imported pages for consumption on other pages and I had alway done it using the default import: `import Index from './../pages/Index.vue' – Steve Hynding Sep 13 '18 at 19:02
  • It does not solve the problem sadly, the issue seems to be linked to babel's transpiling of my vue components – Christopher Sep 19 '18 at 15:06
  • That makes sense, I should have read in closer. I think the big issue you're facing is that Nuxt is an integrated and end-to-end solution but you're attempting to unit test only the front-end component. Are you opposed to running tests the way Nuxt.js suggests in their example with Ava? (https://nuxtjs.org/examples/testing) – Steve Hynding Sep 19 '18 at 15:42

0 Answers0