vuejs / vue-jest

Jest Vue transformer
MIT License
746 stars 157 forks source link

Fails on lack of ts-jest even though it's optional #431

Closed Andarist closed 2 years ago

Andarist commented 2 years ago

It's states that ts-jest is an optional peer dep: https://github.com/vuejs/vue-jest/blob/6edfa9cd93be05ca4c9c41849db668dbf2ae92d5/packages/vue3-jest/package.json#L47-L49 However, @vue/vue3-jest cannot be used without it because if we have tsconfig.json then ts-jest is being required here: https://github.com/vuejs/vue-jest/blob/6edfa9cd93be05ca4c9c41849db668dbf2ae92d5/packages/vue3-jest/lib/utils.js#L81

Since my whole monorepo is using Babel I don't want to rely on the TypeScript compiler for transpilation purposes at all. It doesn't make sense because it could introduce subtle differences between the transpilation output in tests and in my app bundles.

I'd like to have a way to disable ts-jest completely and just use babel-jest for transpilation. I've already figured out that I can disable this part: https://github.com/vuejs/vue-jest/blob/6edfa9cd93be05ca4c9c41849db668dbf2ae92d5/packages/vue3-jest/lib/process.js#L21-L22 with a config such as this:

const { constants } = require('jest-config');

module.exports = {
  transform: {
    [constants.DEFAULT_JS_PATTERN]: 'babel-jest',
    '^.+\\.vue$': '@vue/vue3-jest',
  },
  globals: {
    'vue-jest': {
      // weird way of disabling ts-jest-based transformer
      transform: {
        '^typescript$': 'babel-jest',
        '^tsx?$': 'babel-jest'
      }
    }
  },
};

but then I've found out that ts-jest is still being required through here: https://github.com/vuejs/vue-jest/blob/5741877f77f40d9ee5e411b2252156d6256b8af6/packages/vue3-jest/lib/process.js#L121

So my current workaround for this is this:

const { constants } = require('jest-config');
const os = require('os');

module.exports = {
  transform: {
    [constants.DEFAULT_JS_PATTERN]: 'babel-jest',
    '^.+\\.vue$': '@vue/vue3-jest',
  },
  globals: {
    'vue-jest': {
      // weird way of disabling ts-jest-based transformer
      transform: {
        '^typescript$': 'babel-jest',
        '^tsx?$': 'babel-jest'
      },
      // redirect tsconfig lookup elsewhere so vue-jest doesn't attempt to load ts-jest at all
      tsConfig: os.tmpdir()
    }
  },
};
miyanokomiya commented 2 years ago

Same here. I tried to switch from ts-jest to @swc/jest, but I failed due to lack of ts-jest.

https://github.com/miyanokomiya/blendic-svg/runs/5268921002?check_suite_focus=true

Although tests on Github Actions env failed, they passed on my local env(wsl2 ubuntu). I don't know why

distor-sil3nt commented 2 years ago

This issue is haunting me, too. When I try @Andarist solution and replace babel-jest with @swc/jest I get the error:

[vue-jest] Error: transformer must contain at least one process, preprocess, or postprocess method 

Any chance to remove this dependency on ts-jest?

nogic1008 commented 2 years ago

In fact, ts-jest is only used to load TypeScript configs. I'll create a PR that replace it to tsconfig package.