Skip to content

Commit 47244cd

Browse files
cexbrayatcexbrayat
authored
feat: support jest v27 in vue3-jest (#343)
* test: add typescript e2e test without babel Adds a test close to the setup used by the CLI in a TS project without Babel. The existing TS test was moved to `typescript-with-babel`. The new test is a copy of the older one, with all babel dependencies removed, a rewritten component using the Composition API, a test in TS, a TS config close to the CLI one, and a shim file. * feat: support jest v27 in vue3-jest And also babel-jest and ts-jest v27, for Vue 3. * feat: use TS config to have commonjs modules The previous logic was trying to figure out if CommonJS modules were used in the TS config and if not, and if no babel configuration provided, then loaded a babel transformer to change the module format. This changes the logic to use a more straightforward method by directly updating the tsconfig to commonjs, which should hopefully have the same results without side-effects.
1 parent 9e3b610 commit 47244cd

File tree

19 files changed

+3537
-2368
lines changed

19 files changed

+3537
-2368
lines changed

‎.circleci/config.yml

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ version: 2
22
jobs:
33
build:
44
docker:
5-
- image: circleci/node:10.16.3
5+
- image: circleci/node:10.24.1
66

77
working_directory: ~/repo
88

‎e2e/2.x/custom-transformers/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
"@babel/core": "^7.9.0",
1515
"@babel/preset-env": "^7.9.0",
1616
"@vue/test-utils": "^1.1.0",
17+
"babel-jest": "^26.6.3",
1718
"jest": "26.x",
1819
"postcss": "^7.0.13",
1920
"postcss-color-function": "^4.0.1",

‎e2e/3.x/babel-in-package/package.json

+4-3
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,13 @@
1414
"@babel/preset-env": "^7.9.0",
1515
"@vue/compiler-sfc": "^3.0.3",
1616
"coffeescript": "^2.3.2",
17-
"jest": "^26.0.0",
18-
"ts-jest": "^26.4.4",
17+
"jest": "^27.0.0",
18+
"ts-jest": "^27.0.1",
1919
"typescript": "^4.1.2",
20-
"vue3-jest": "^26.0.0-alpha.10"
20+
"vue3-jest": "^27.0.0-alpha.1"
2121
},
2222
"jest": {
23+
"testEnvironment": "jsdom",
2324
"moduleFileExtensions": [
2425
"js",
2526
"json",

‎e2e/3.x/basic/package.json

+4-3
Original file line numberDiff line numberDiff line change
@@ -18,15 +18,16 @@
1818
"babel-plugin-transform-vue-jsx": "^3.7.0",
1919
"coffeescript": "^2.3.2",
2020
"jade": "^1.11.0",
21-
"jest": "^26.0.0",
21+
"jest": "^27.0.0",
2222
"pug": "^2.0.3",
23-
"ts-jest": "^26.4.4",
23+
"ts-jest": "^27.0.1",
2424
"typescript": "^4.1.2",
2525
"vue-class-component": "^8.0.0-beta.4",
26-
"vue3-jest": "^26.0.0-alpha.10",
26+
"vue3-jest": "^27.0.0-alpha.1",
2727
"vue-property-decorator": "^10.0.0-rc.3"
2828
},
2929
"jest": {
30+
"testEnvironment": "jsdom",
3031
"moduleFileExtensions": [
3132
"js",
3233
"json",

‎e2e/3.x/basic/test.js

+8-6
Original file line numberDiff line numberDiff line change
@@ -72,21 +72,23 @@ test('handles named exports', () => {
7272
test('generates source maps for .vue files', () => {
7373
const filePath = resolve(__dirname, './components/Basic.vue')
7474
const fileString = readFileSync(filePath, { encoding: 'utf8' })
75-
76-
const { code } = jestVue.process(fileString, filePath, {
75+
const config = {
7776
moduleFileExtensions: ['js', 'vue']
78-
})
77+
}
78+
79+
const { code } = jestVue.process(fileString, filePath, { config })
7980

8081
expect(code).toMatchSnapshot()
8182
})
8283

8384
test('generates source maps using src attributes', () => {
8485
const filePath = resolve(__dirname, './components/SourceMapsSrc.vue')
8586
const fileString = readFileSync(filePath, { encoding: 'utf8' })
86-
87-
const { code } = jestVue.process(fileString, filePath, {
87+
const config = {
8888
moduleFileExtensions: ['js', 'vue']
89-
})
89+
}
90+
91+
const { code } = jestVue.process(fileString, filePath, { config })
9092

9193
expect(code).toMatchSnapshot()
9294
})

‎e2e/3.x/custom-transformers/babel-transformer.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
const { createTransformer } = require('babel-jest')
1+
const { createTransformer } = require('babel-jest').default
22
module.exports = createTransformer({
33
presets: ['@babel/preset-env']
44
})

‎e2e/3.x/custom-transformers/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@
1313
"devDependencies": {
1414
"@babel/core": "^7.9.0",
1515
"@babel/preset-env": "^7.9.0",
16-
"babel-jest": "^26.0.0",
16+
"babel-jest": "^27.0.0",
1717
"extract-from-css": "^0.4.4",
18-
"jest": "^26.0.0",
18+
"jest": "^27.0.0",
1919
"postcss": "^7.0.13",
2020
"postcss-color-function": "^4.0.1",
2121
"sass": "^1.23.7",
22-
"vue3-jest": "^26.0.0-alpha.10"
22+
"vue3-jest": "^27.0.0-alpha.1"
2323
},
2424
"jest": {
2525
"moduleFileExtensions": [

‎e2e/3.x/javascript/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,11 @@
1313
"@babel/core": "^7.9.0",
1414
"@babel/preset-env": "^7.9.0",
1515
"coffeescript": "^2.3.2",
16-
"jest": "^26.0.0",
17-
"vue3-jest": "^26.0.0-alpha.10"
16+
"jest": "^27.0.0",
17+
"vue3-jest": "^27.0.0-alpha.1"
1818
},
1919
"jest": {
20+
"testEnvironment": "jsdom",
2021
"moduleFileExtensions": [
2122
"js",
2223
"json",

‎e2e/3.x/style/package.json

+3-2
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,15 @@
1414
"@babel/core": "^7.9.0",
1515
"@babel/preset-env": "^7.9.0",
1616
"@vue/test-utils": "^1.1.0",
17-
"jest": "^26.0.0",
17+
"jest": "^27.0.0",
1818
"less": "^3.9.0",
1919
"postcss": "^7.0.13",
2020
"sass": "^1.23.7",
2121
"stylus": "^0.54.5",
22-
"vue3-jest": "^26.0.0-alpha.10"
22+
"vue3-jest": "^27.0.0-alpha.1"
2323
},
2424
"jest": {
25+
"testEnvironment": "jsdom",
2526
"moduleFileExtensions": [
2627
"js",
2728
"json",

‎e2e/3.x/typescript-with-babel/package.json

+3-3
Original file line numberDiff line numberDiff line change
@@ -13,10 +13,10 @@
1313
"devDependencies": {
1414
"@babel/core": "^7.9.0",
1515
"@babel/preset-env": "^7.9.0",
16-
"jest": "^26.0.0",
17-
"ts-jest": "^26.4.4",
16+
"jest": "^27.0.0",
17+
"ts-jest": "^27.0.1",
1818
"typescript": "^4.1.2",
19-
"vue3-jest": "^26.0.0-alpha.10"
19+
"vue3-jest": "^27.0.0-alpha.1"
2020
},
2121
"jest": {
2222
"testEnvironment": "jsdom",

‎e2e/3.x/typescript/package.json

+4-3
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,13 @@
1212
},
1313
"devDependencies": {
1414
"@types/jest": "16.0.10",
15-
"jest": "^26.0.0",
16-
"ts-jest": "^26.4.4",
15+
"jest": "^27.0.0",
16+
"ts-jest": "^27.0.1",
1717
"typescript": "^4.1.2",
18-
"vue3-jest": "^26.0.0-alpha.10"
18+
"vue3-jest": "^27.0.0-alpha.1"
1919
},
2020
"jest": {
21+
"testEnvironment": "jsdom",
2122
"moduleFileExtensions": [
2223
"js",
2324
"ts",

‎packages/vue3-jest/lib/index.js

+4-5
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
const crypto = require('crypto')
2-
const babelJest = require('babel-jest')
3-
2+
const babelJest = require('babel-jest').default
43
module.exports = {
54
process: require('./process'),
65
getCacheKey: function getCacheKey(
76
fileData,
87
filename,
9-
configString,
10-
{ config, instrument, rootDir }
8+
{ config, configString, instrument, rootDir }
119
) {
1210
return crypto
1311
.createHash('md5')
1412
.update(
15-
babelJest.getCacheKey(fileData, filename, configString, {
13+
babelJest.getCacheKey(fileData, filename, {
1614
config,
15+
configString,
1716
instrument,
1817
rootDir
1918
}),

‎packages/vue3-jest/lib/process-style.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,7 @@ module.exports = function processStyle(stylePart, filePath, config = {}) {
7979
const preprocessOptions = getPreprocessOptions(
8080
stylePart.lang,
8181
filePath,
82-
config
82+
config.config
8383
)
8484
const result = compileStyle({
8585
id: `vue-jest-${filePath}`,

‎packages/vue3-jest/lib/process.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
const { parse, compileTemplate, compileScript } = require('@vue/compiler-sfc')
22
const { transform } = require('@babel/core')
3-
const babelTransformer = require('babel-jest')
3+
const babelTransformer = require('babel-jest').default
44

55
const typescriptTransformer = require('./transformers/typescript')
66
const coffeescriptTransformer = require('./transformers/coffee')

‎packages/vue3-jest/lib/transformers/coffee.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ const throwError = require('../utils').throwError
33
const getBabelOptions = require('../utils').getBabelOptions
44

55
module.exports = {
6-
process(src, filename, config) {
6+
process(src, filename) {
77
ensureRequire('coffee', ['coffeescript'])
88
const coffee = require('coffeescript')
99
const babelOptions = getBabelOptions(filename)

‎packages/vue3-jest/lib/transformers/typescript.js

+2-19
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
const ensureRequire = require('../ensure-require')
2-
const babelJest = require('babel-jest')
2+
const babelJest = require('babel-jest').default
33
const {
4-
getBabelOptions,
54
getTsJestConfig,
65
stripInlineSourceMap,
76
getCustomTransformer,
@@ -14,7 +13,6 @@ module.exports = {
1413
const typescript = require('typescript')
1514
const vueJestConfig = getVueJestConfig(config)
1615
const tsconfig = getTsJestConfig(config)
17-
const babelOptions = getBabelOptions(filePath)
1816

1917
const res = typescript.transpileModule(scriptContent, {
2018
...tsconfig,
@@ -26,26 +24,11 @@ module.exports = {
2624
const inputSourceMap =
2725
res.sourceMapText !== undefined ? JSON.parse(res.sourceMapText) : ''
2826

29-
// handle ES modules in TS source code in case user uses non commonjs module
30-
// output and there is no .babelrc.
31-
let inlineBabelOptions = {}
32-
if (
33-
tsconfig.compilerOptions.module !== typescript.ModuleKind.CommonJS &&
34-
!babelOptions
35-
) {
36-
inlineBabelOptions = {
37-
plugins: [require('@babel/plugin-transform-modules-commonjs')]
38-
}
39-
}
4027
const customTransformer =
4128
getCustomTransformer(vueJestConfig['transform'], 'js') || {}
4229
const transformer = customTransformer.process
4330
? customTransformer
44-
: babelJest.createTransformer(
45-
Object.assign(inlineBabelOptions, {
46-
inputSourceMap
47-
})
48-
)
31+
: babelJest.createTransformer({ inputSourceMap })
4932

5033
return transformer.process(res.outputText, filePath, config)
5134
}

‎packages/vue3-jest/lib/utils.js

+10-5
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,11 @@ const transformContent = function transformContent(
4949

5050
const getVueJestConfig = function getVueJestConfig(jestConfig) {
5151
return (
52-
(jestConfig && jestConfig.globals && jestConfig.globals['vue-jest']) || {}
52+
(jestConfig &&
53+
jestConfig.config &&
54+
jestConfig.config.globals &&
55+
jestConfig.config.globals['vue-jest']) ||
56+
{}
5357
)
5458
}
5559
const getBabelOptions = function loadBabelOptions(filename, options = {}) {
@@ -74,12 +78,13 @@ const getTsJestConfig = function getTsJestConfig(config) {
7478
return null
7579
}
7680

77-
const createTransformer = require('ts-jest').createTransformer
78-
const tr = createTransformer()
79-
const configSet = tr.configsFor(config)
81+
const { ConfigSet } = require('ts-jest/dist/config/config-set')
82+
const configSet = new ConfigSet(config.config)
8083
const tsConfig = configSet.typescript || configSet.parsedTsConfig
8184
// Force es5 to prevent const vue_1 = require('vue') from conflicting
82-
return { compilerOptions: { ...tsConfig.options, target: 'es5' } }
85+
return {
86+
compilerOptions: { ...tsConfig.options, target: 'es5', module: 'commonjs' }
87+
}
8388
}
8489

8590
function isValidTransformer(transformer) {

‎packages/vue3-jest/package.json

+8-7
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "vue3-jest",
3-
"version": "26.0.0-alpha.10",
3+
"version": "27.0.0-alpha.1",
44
"description": "Jest Vue transform",
55
"main": "lib/index.js",
66
"files": [
@@ -27,19 +27,20 @@
2727
"@babel/core": "^7.9.0",
2828
"@vue/compiler-sfc": "^3.0.3",
2929
"babel-core": "^7.0.0-bridge.0",
30-
"babel-jest": "^26.0.0",
30+
"babel-jest": "^27.0.0",
3131
"conventional-changelog": "^1.1.5",
32-
"jest": "^26.0.0",
32+
"jest": "^27.0.0",
33+
"jest-cli": "^27.0.0",
3334
"semantic-release": "^15.13.2",
34-
"ts-jest": "^26.4.4",
35+
"ts-jest": "^27.0.1",
3536
"typescript": "^4.1.2",
3637
"vue": "^3.0.3"
3738
},
3839
"peerDependencies": {
3940
"@babel/core": "7.x",
40-
"babel-jest": "26.x",
41-
"jest": "26.x",
42-
"ts-jest": "26.x",
41+
"babel-jest": "27.x",
42+
"jest": "27.x",
43+
"ts-jest": "27.x",
4344
"typescript": ">= 3.x",
4445
"vue": "^3.0.0-0"
4546
},

0 commit comments

Comments
 (0)