Can't run unit test in CI environment (GitHub action)

[onx2]

TypeError: Cannot read property 'options' of undefined

I'm unable to run vue test utils in CI environment (GitHub action). I saw this issue from a while back (different version but looks like a similar issue?) but sync: false isn't an option anymore.

Steps to reproduce

• Install the most recent @next versions of vue-jest and @vue/test-utils
• Use the below setup
• Create a simple unit test
• Works locally
• Fails in CI

Expected behaviour

Tests run the same way they do locally

Actual behaviour

Tests work locally but not in CI

Possible Solution

I think my CI test environment might not be configured correctly but I don't know what is wrong.

Here's the full error:

 Run yarn test:unit
8s
##[error]Process completed with exit code 1.
Run yarn test:unit
yarn run v1.22.4
$ jest
FAIL src/apps/FrontDesk/FrontDesk.spec.ts
  ● Test suite failed to run

    TypeError: Cannot read property 'options' of undefined

      at getTsJestConfig (node_modules/vue-jest/lib/utils.js:71:45)
      at processTemplate (node_modules/vue-jest/lib/process.js:73:20)
      at Object.module.exports [as process] (node_modules/vue-jest/lib/process.js:107:26)
      at ScriptTransformer.transformSource (node_modules/@jest/transform/build/ScriptTransformer.js:463:35)
      at ScriptTransformer._transformAndBuildScript (node_modules/@jest/transform/build/ScriptTransformer.js:568:40)
      at ScriptTransformer.transform (node_modules/@jest/transform/build/ScriptTransformer.js:606:25)

Test Suites: 1 failed, 1 total
Tests:       0 total
Snapshots:   0 total
Time:        6.696 s
Ran all test suites.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
##[error]Process completed with exit code 1.

versions

"@babel/node": "^7.10.5",
"@babel/preset-env": "^7.11.0",
"@types/jest": "^26.0.10",
"babel-jest": "^26.3.0",
"@vue/test-utils": "^2.0.0-beta.3",
"ts-jest": "^26.3.0",
"jest": "^26.4.2",
"vue-jest": "^5.0.0-alpha.3"

Component to test

<script>
import { defineComponent } from "vue"

export default defineComponent({
  name: "FrontDesk",
  setup() {
    return {}
  },
})
</script>

<template>
  <div>
    <h1>Front Desk</h1>
  </div>
</template>

My test

import { mount, shallowMount } from "@vue/test-utils"
import FrontDesk from "./FrontDesk.vue"

test("uses mounts", async () => {
  const wrapper = mount(FrontDesk, {})
  expect(wrapper.html()).toContain("Front Desk")
})

test("uses shallowMount", async () => {
  const wrapper = shallowMount(FrontDesk, {})
  expect(wrapper.html()).toContain("Front Desk")
})

jest.config.js

module.exports = {
  preset: "ts-jest",
  globals: {},
  testEnvironment: "jsdom",
  transform: {
    "^.+\\.vue$": "vue-jest",
    "^.+\\js$": "babel-jest",
  },
  moduleFileExtensions: ["vue", "js", "json", "jsx", "ts", "tsx", "node"],
}

tsconfig.json

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "declaration": true,
    "importHelpers": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "lib": ["ESNext", "DOM"],
    "module": "ESNext",
    "moduleResolution": "Node",
    "sourceMap": true,
    "target": "ES6",
    "types": ["jest"]
  },
  "include": ["src"]
}

babel.config.js

module.exports = {
  presets: [
    [
      "@babel/preset-env",
      {
        targets: {
          node: "current",
        },
      },
    ],
  ],
}

[onx2]

nvm - got it working by cherry picking changes from vtu-next-demo

[onx2]

These are the versions that seem to play nicely together

"dependencies": {
    "vue": "^3.0.0-rc.9",
    "vue-router": "^4.0.0-beta.7"
  },
  "devDependencies": {
    "@babel/node": "^7.10.5",
    "@babel/preset-env": "^7.11.5",
    "@types/jest": "^26.0.12",
    "@vue/compiler-sfc": "^3.0.0-rc.9",
    "@vue/test-utils": "^2.0.0-beta.3",
    "babel-jest": "^26.3.0",
    "flush-promises": "^1.0.2",
    "jest": "^26.4.2",
    "ts-jest": "^25.3.1",
    "tslib": "^2.0.1",
    "typescript": "^3.8.3",
    "vite": "^1.0.0-rc.4",
    "vue-jest": "^5.0.0-alpha.3"
  }

it seems that upgrading ts-jest past this point causes issues... just tested upgrading typescript to 4.x and it works as well.

Also there needs to be a vue-shims.d.ts file in the root with the following inside:

declare module "*.vue" {
  import { defineComponent } from "vue"
  const component: ReturnType<typeof defineComponent>

  export default component
}