feat: support jest v27 in vue3-jest

cexbrayat · cexbrayat · commit c2e291303534 · 2021-07-14T10:22:00.000+02:00
And also babel-jest and ts-jest v27, for Vue 3.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -2,7 +2,7 @@ version: 2
 jobs:
   build:
     docker:
-      - image: circleci/node:10.16.3
+      - image: circleci/node:10.24.1
 
     working_directory: ~/repo
 
diff --git a/e2e/2.x/custom-transformers/package.json b/e2e/2.x/custom-transformers/package.json
@@ -14,6 +14,7 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@vue/test-utils": "^1.1.0",
+    "babel-jest": "^26.6.3",
     "jest": "26.x",
     "postcss": "^7.0.13",
     "postcss-color-function": "^4.0.1",
diff --git a/e2e/3.x/babel-in-package/package.json b/e2e/3.x/babel-in-package/package.json
@@ -14,12 +14,13 @@
     "@babel/preset-env": "^7.9.0",
     "@vue/compiler-sfc": "^3.0.3",
     "coffeescript": "^2.3.2",
-    "jest": "^26.0.0",
-    "ts-jest": "^26.4.4",
+    "jest": "^27.0.0",
+    "ts-jest": "^27.0.1",
     "typescript": "^4.1.2",
-    "vue3-jest": "^26.0.0-alpha.10"
+    "vue3-jest": "^27.0.0-alpha.1"
   },
   "jest": {
+    "testEnvironment": "jsdom",
     "moduleFileExtensions": [
       "js",
       "json",
diff --git a/e2e/3.x/basic/package.json b/e2e/3.x/basic/package.json
@@ -18,15 +18,16 @@
     "babel-plugin-transform-vue-jsx": "^3.7.0",
     "coffeescript": "^2.3.2",
     "jade": "^1.11.0",
-    "jest": "^26.0.0",
+    "jest": "^27.0.0",
     "pug": "^2.0.3",
-    "ts-jest": "^26.4.4",
+    "ts-jest": "^27.0.1",
     "typescript": "^4.1.2",
     "vue-class-component": "^8.0.0-beta.4",
-    "vue3-jest": "^26.0.0-alpha.10",
+    "vue3-jest": "^27.0.0-alpha.1",
     "vue-property-decorator": "^10.0.0-rc.3"
   },
   "jest": {
+    "testEnvironment": "jsdom",
     "moduleFileExtensions": [
       "js",
       "json",
diff --git a/e2e/3.x/basic/test.js b/e2e/3.x/basic/test.js
@@ -72,21 +72,23 @@ test('handles named exports', () => {
 test('generates source maps for .vue files', () => {
   const filePath = resolve(__dirname, './components/Basic.vue')
   const fileString = readFileSync(filePath, { encoding: 'utf8' })
-
-  const { code } = jestVue.process(fileString, filePath, {
+  const config = {
     moduleFileExtensions: ['js', 'vue']
-  })
+  }
+
+  const { code } = jestVue.process(fileString, filePath, { config })
 
   expect(code).toMatchSnapshot()
 })
 
 test('generates source maps using src attributes', () => {
   const filePath = resolve(__dirname, './components/SourceMapsSrc.vue')
   const fileString = readFileSync(filePath, { encoding: 'utf8' })
-
-  const { code } = jestVue.process(fileString, filePath, {
+  const config = {
     moduleFileExtensions: ['js', 'vue']
-  })
+  }
+
+  const { code } = jestVue.process(fileString, filePath, { config })
 
   expect(code).toMatchSnapshot()
 })
diff --git a/e2e/3.x/custom-transformers/babel-transformer.js b/e2e/3.x/custom-transformers/babel-transformer.js
@@ -1,4 +1,4 @@
-const { createTransformer } = require('babel-jest')
+const { createTransformer } = require('babel-jest').default
 module.exports = createTransformer({
   presets: ['@babel/preset-env']
 })
diff --git a/e2e/3.x/custom-transformers/package.json b/e2e/3.x/custom-transformers/package.json
@@ -13,13 +13,13 @@
   "devDependencies": {
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
-    "babel-jest": "^26.0.0",
+    "babel-jest": "^27.0.0",
     "extract-from-css": "^0.4.4",
-    "jest": "^26.0.0",
+    "jest": "^27.0.0",
     "postcss": "^7.0.13",
     "postcss-color-function": "^4.0.1",
     "sass": "^1.23.7",
-    "vue3-jest": "^26.0.0-alpha.10"
+    "vue3-jest": "^27.0.0-alpha.1"
   },
   "jest": {
     "moduleFileExtensions": [
diff --git a/e2e/3.x/javascript/package.json b/e2e/3.x/javascript/package.json
@@ -13,10 +13,11 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "coffeescript": "^2.3.2",
-    "jest": "^26.0.0",
-    "vue3-jest": "^26.0.0-alpha.10"
+    "jest": "^27.0.0",
+    "vue3-jest": "^27.0.0-alpha.1"
   },
   "jest": {
+    "testEnvironment": "jsdom",
     "moduleFileExtensions": [
       "js",
       "json",
diff --git a/e2e/3.x/style/package.json b/e2e/3.x/style/package.json
@@ -14,14 +14,15 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@vue/test-utils": "^1.1.0",
-    "jest": "^26.0.0",
+    "jest": "^27.0.0",
     "less": "^3.9.0",
     "postcss": "^7.0.13",
     "sass": "^1.23.7",
     "stylus": "^0.54.5",
-    "vue3-jest": "^26.0.0-alpha.10"
+    "vue3-jest": "^27.0.0-alpha.1"
   },
   "jest": {
+    "testEnvironment": "jsdom",
     "moduleFileExtensions": [
       "js",
       "json",
diff --git a/e2e/3.x/typescript-with-babel/package.json b/e2e/3.x/typescript-with-babel/package.json
@@ -13,10 +13,10 @@
   "devDependencies": {
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
-    "jest": "^26.0.0",
-    "ts-jest": "^26.4.4",
+    "jest": "^27.0.0",
+    "ts-jest": "^27.0.1",
     "typescript": "^4.1.2",
-    "vue3-jest": "^26.0.0-alpha.10"
+    "vue3-jest": "^27.0.0-alpha.1"
   },
   "jest": {
     "testEnvironment": "jsdom",
diff --git a/e2e/3.x/typescript/package.json b/e2e/3.x/typescript/package.json
@@ -12,12 +12,13 @@
   },
   "devDependencies": {
     "@types/jest": "16.0.10",
-    "jest": "^26.0.0",
-    "ts-jest": "^26.4.4",
+    "jest": "^27.0.0",
+    "ts-jest": "^27.0.1",
     "typescript": "^4.1.2",
-    "vue3-jest": "^26.0.0-alpha.10"
+    "vue3-jest": "^27.0.0-alpha.1"
   },
   "jest": {
+    "testEnvironment": "jsdom",
     "moduleFileExtensions": [
       "js",
       "ts",
diff --git a/packages/vue3-jest/lib/index.js b/packages/vue3-jest/lib/index.js
@@ -1,19 +1,18 @@
 const crypto = require('crypto')
-const babelJest = require('babel-jest')
-
+const babelJest = require('babel-jest').default
 module.exports = {
   process: require('./process'),
   getCacheKey: function getCacheKey(
     fileData,
     filename,
-    configString,
-    { config, instrument, rootDir }
+    { config, configString, instrument, rootDir }
   ) {
     return crypto
       .createHash('md5')
       .update(
-        babelJest.getCacheKey(fileData, filename, configString, {
+        babelJest.getCacheKey(fileData, filename, {
           config,
+          configString,
           instrument,
           rootDir
         }),
diff --git a/packages/vue3-jest/lib/process-style.js b/packages/vue3-jest/lib/process-style.js
@@ -79,7 +79,7 @@ module.exports = function processStyle(stylePart, filePath, config = {}) {
     const preprocessOptions = getPreprocessOptions(
       stylePart.lang,
       filePath,
-      config
+      config.config
     )
     const result = compileStyle({
       id: `vue-jest-${filePath}`,
diff --git a/packages/vue3-jest/lib/process.js b/packages/vue3-jest/lib/process.js
@@ -1,6 +1,6 @@
 const { parse, compileTemplate, compileScript } = require('@vue/compiler-sfc')
 const { transform } = require('@babel/core')
-const babelTransformer = require('babel-jest')
+const babelTransformer = require('babel-jest').default
 
 const typescriptTransformer = require('./transformers/typescript')
 const coffeescriptTransformer = require('./transformers/coffee')
diff --git a/packages/vue3-jest/lib/transformers/coffee.js b/packages/vue3-jest/lib/transformers/coffee.js
@@ -3,7 +3,7 @@ const throwError = require('../utils').throwError
 const getBabelOptions = require('../utils').getBabelOptions
 
 module.exports = {
-  process(src, filename, config) {
+  process(src, filename) {
     ensureRequire('coffee', ['coffeescript'])
     const coffee = require('coffeescript')
     const babelOptions = getBabelOptions(filename)
diff --git a/packages/vue3-jest/lib/transformers/typescript.js b/packages/vue3-jest/lib/transformers/typescript.js
@@ -1,5 +1,5 @@
 const ensureRequire = require('../ensure-require')
-const babelJest = require('babel-jest')
+const babelJest = require('babel-jest').default
 const {
   getBabelOptions,
   getTsJestConfig,
@@ -27,11 +27,12 @@ module.exports = {
       res.sourceMapText !== undefined ? JSON.parse(res.sourceMapText) : ''
 
     // handle ES modules in TS source code in case user uses non commonjs module
-    // output and there is no .babelrc.
+    // output and there is no presets or plugins defined in package.json or babel config file
     let inlineBabelOptions = {}
     if (
       tsconfig.compilerOptions.module !== typescript.ModuleKind.CommonJS &&
-      !babelOptions
+      !(babelOptions.presets && babelOptions.presets.length) &&
+      !(babelOptions.plugins && babelOptions.plugins.length)
     ) {
       inlineBabelOptions = {
         plugins: [require('@babel/plugin-transform-modules-commonjs')]
diff --git a/packages/vue3-jest/lib/utils.js b/packages/vue3-jest/lib/utils.js
@@ -49,7 +49,11 @@ const transformContent = function transformContent(
 
 const getVueJestConfig = function getVueJestConfig(jestConfig) {
   return (
-    (jestConfig && jestConfig.globals && jestConfig.globals['vue-jest']) || {}
+    (jestConfig &&
+      jestConfig.config &&
+      jestConfig.config.globals &&
+      jestConfig.config.globals['vue-jest']) ||
+    {}
   )
 }
 const getBabelOptions = function loadBabelOptions(filename, options = {}) {
@@ -74,9 +78,8 @@ const getTsJestConfig = function getTsJestConfig(config) {
     return null
   }
 
-  const createTransformer = require('ts-jest').createTransformer
-  const tr = createTransformer()
-  const configSet = tr.configsFor(config)
+  const { ConfigSet } = require('ts-jest/dist/config/config-set')
+  const configSet = new ConfigSet(config.config)
   const tsConfig = configSet.typescript || configSet.parsedTsConfig
   // Force es5 to prevent const vue_1 = require('vue') from conflicting
   return { compilerOptions: { ...tsConfig.options, target: 'es5' } }
diff --git a/packages/vue3-jest/package.json b/packages/vue3-jest/package.json
@@ -1,6 +1,6 @@
 {
   "name": "vue3-jest",
-  "version": "26.0.0-alpha.10",
+  "version": "27.0.0-alpha.1",
   "description": "Jest Vue transform",
   "main": "lib/index.js",
   "files": [
@@ -27,19 +27,20 @@
     "@babel/core": "^7.9.0",
     "@vue/compiler-sfc": "^3.0.3",
     "babel-core": "^7.0.0-bridge.0",
-    "babel-jest": "^26.0.0",
+    "babel-jest": "^27.0.0",
     "conventional-changelog": "^1.1.5",
-    "jest": "^26.0.0",
+    "jest": "^27.0.0",
+    "jest-cli": "^27.0.0",
     "semantic-release": "^15.13.2",
-    "ts-jest": "^26.4.4",
+    "ts-jest": "^27.0.1",
     "typescript": "^4.1.2",
     "vue": "^3.0.3"
   },
   "peerDependencies": {
     "@babel/core": "7.x",
-    "babel-jest": "26.x",
-    "jest": "26.x",
-    "ts-jest": "26.x",
+    "babel-jest": "27.x",
+    "jest": "27.x",
+    "ts-jest": "27.x",
     "typescript": ">= 3.x",
     "vue": "^3.0.0-0"
   },
diff --git a/yarn.lock b/yarn.lock

Original file line number	Diff line number	Diff line change
`@@ -79,7 +79,7 @@ module.exports = function processStyle(stylePart, filePath, config = {}) {`
`79`	`79`	`const preprocessOptions = getPreprocessOptions(`
`80`	`80`	`stylePart.lang,`
`81`	`81`	`filePath,`
`82`		`- config`
	`82`	`+ config.config`
`83`	`83`	`)`
`84`	`84`	`const result = compileStyle({`
`85`	`85`	id: `vue-jest-${filePath}`,