1

I adding unit tests to my Nuxt/Vue project and I'm using Jest for unit testing, I'm fetching data from the server-side using Apollo Client and I have a problem with importing .gql files inside test files.

here is the query file names.gql

{
 names {
  created_at
  id
  name
  published_at
  updated_at
 }
}

I'm importing the query inside Vue component like this

import namesQuery from "@/queries/names";

Test file:

import { mount } from '@vue/test-utils';

import Names from '@/components/Names';

describe('Names', () => {
  test('is a Vue instance', () => {
    const wrapper = mount(Names)
    expect(wrapper.vm).toBeTruthy()
  })
})

When I run the tests, it says:

SyntaxError: Unexpected token '{'

Please advise.

skyboyer
  • 22,209
  • 7
  • 57
  • 64
Pearl Nelson
  • 11
  • 1

1 Answers1

2

According to the graphql-tag documentation you need to use jest-transform-graphql to handle imports.

Add this to your jest config file:

"transform": {
  "\\.(gql|graphql)$": "jest-transform-graphql",
}

and then let the party begin

Malik Türk
  • 95
  • 1
  • 9