breaking: support Jest 29 (#494)

* chore(deps): update jest packages to v29 - babel-jest - jest - jest-environment-jsdom * test: update snapshot https://jestjs.io/blog/2022/08/25/jest-29 * fix(test): remove absolute path in e2e tests * ci(gh-action): avoid use Node.js 12 & add v18 * chore(deps-dev): update ts-jest to v29 * chore(deps): update jest packages * chore(deps): hoist project packages
vuejs · Aug 30, 2022 · 1cd403d · 1cd403d
1 parent 4855375
commit 1cd403d
Show file tree

Hide file tree

Showing 25 changed files with 677 additions and 922 deletions.
diff --git a/.github/workflows/node.yml b/.github/workflows/node.yml
@@ -20,26 +20,17 @@ jobs:
   test:
     strategy:
       matrix:
-        node: [12, 14, 16]
+        node: [14, 16, 18]
     runs-on: ubuntu-latest
 
     steps:
       - uses: actions/checkout@v2
       - name: Use Node.js ${{ matrix.node }}
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
           node-version: ${{ matrix.node }}
+          cache: yarn
 
-      - name: Get yarn cache directory path
-        id: yarn-cache
-        run: echo "::set-output name=dir::$(yarn cache dir)"
-      - name: Cache Dependencies
-        uses: actions/cache@v2
-        with:
-          path: ${{ steps.yarn-cache.outputs.dir }}
-          key: yarn-${{ hashFiles('**/yarn.lock') }}
-          restore-keys: |
-            yarn-
       - name: Install Project Dependencies
         run: yarn --frozen-lockfile
 

diff --git a/e2e/2.x/babel-in-package/package.json b/e2e/2.x/babel-in-package/package.json
@@ -16,10 +16,10 @@
     "@babel/preset-env": "^7.9.0",
     "@vue/babel-preset-jsx": "^1.2.4",
     "@vue/test-utils": "^1.1.0",
-    "@vue/vue2-jest": "^28.0.0",
+    "@vue/vue2-jest": "^29.0.0",
     "coffeescript": "^2.3.2",
-    "jest": "28.x",
-    "jest-environment-jsdom": "28.0.2",
+    "jest": "29.x",
+    "jest-environment-jsdom": "29.x",
     "typescript": "^4.6.4"
   },
   "jest": {

diff --git a/e2e/2.x/basic/__snapshots__/test.js.snap b/e2e/2.x/basic/__snapshots__/test.js.snap
@@ -1,10 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`generates source maps for .vue files 1`] = `
-Object {
-  "file": "/home/runner/work/vue-jest/vue-jest/e2e/2.x/basic/components/Basic.vue",
+{
+  "file": "./components/Basic.vue",
   "mappings": ";;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;eAEe;AACbA,MAAI,EAAE,OADO;AAEbC,UAAQ,EAAE;AACRC,kBAAc,EAAE,SAASA,cAAT,GAA0B;AACxC,aAAO;AACLC,WAAG,EAAE,KAAKC,OADL;AAELC,YAAI,EAAE,CAAC,KAAKD,OAFP;AAGLE,cAAM,EAAE,KAAKF;AAHR,OAAP;AAKD;AAPO,GAFG;AAWbG,MAAI,EAAE,SAASA,IAAT,GAAgB;AACpB,WAAO;AACLC,SAAG,EAAE,4BADA;AAELJ,aAAO,EAAE;AAFJ,KAAP;AAID,GAhBY;AAiBbK,SAAO,EAAE;AACPC,eAAW,EAAE,SAASA,WAAT,GAAuB;AAClC,WAAKN,OAAL,GAAe,CAAC,KAAKA,OAArB;AACD;AAHM;AAjBI,C",
-  "names": Array [
+  "names": [
     "name",
     "computed",
     "headingClasses",
@@ -17,10 +17,10 @@ Object {
     "methods",
     "toggleClass",
   ],
-  "sources": Array [
+  "sources": [
     "Basic.vue",
   ],
-  "sourcesContent": Array [
+  "sourcesContent": [
     "//
 //
 //
@@ -74,10 +74,10 @@ export default {
 `;
 
 exports[`generates source maps using src attributes 1`] = `
-Object {
-  "file": "/home/runner/work/vue-jest/vue-jest/e2e/2.x/basic/components/SourceMapsSrc.vue",
+{
+  "file": "./components/SourceMapsSrc.vue",
   "mappings": ";;;;;;eAAe;AACbA,MAAI,EAAE,OADO;AAEbC,UAAQ,EAAE;AACRC,kBAAc,EAAE,SAASA,cAAT,GAA0B;AACxC,aAAO;AACLC,WAAG,EAAE,KAAKC,OADL;AAELC,YAAI,EAAE,CAAC,KAAKD,OAFP;AAGLE,cAAM,EAAE,KAAKF;AAHR,OAAP;AAKD;AAPO,GAFG;AAWbG,MAAI,EAAE,SAASA,IAAT,GAAgB;AACpB,WAAO;AACLC,SAAG,EAAE,4BADA;AAELJ,aAAO,EAAE;AAFJ,KAAP;AAID,GAhBY;AAiBbK,SAAO,EAAE;AACPC,eAAW,EAAE,SAASA,WAAT,GAAuB;AAClC,WAAKN,OAAL,GAAe,CAAC,KAAKA,OAArB;AACD;AAHM;AAjBI,C",
-  "names": Array [
+  "names": [
     "name",
     "computed",
     "headingClasses",
@@ -90,10 +90,10 @@ Object {
     "methods",
     "toggleClass",
   ],
-  "sources": Array [
+  "sources": [
     "SourceMapsSrc.vue",
   ],
-  "sourcesContent": Array [
+  "sourcesContent": [
     "export default {
   name: 'basic',
   computed: {

diff --git a/e2e/2.x/basic/package.json b/e2e/2.x/basic/package.json
@@ -14,14 +14,14 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@vue/test-utils": "^1.1.0",
-    "@vue/vue2-jest": "^28.0.0",
+    "@vue/vue2-jest": "^29.0.0",
     "babel-helper-vue-jsx-merge-props": "^2.0.3",
     "babel-plugin-syntax-jsx": "^6.18.0",
     "babel-plugin-transform-vue-jsx": "^3.7.0",
     "coffeescript": "^2.3.2",
     "jade": "^1.11.0",
-    "jest": "28.x",
-    "jest-environment-jsdom": "28.0.2",
+    "jest": "29.x",
+    "jest-environment-jsdom": "29.x",
     "pug": "^3.0.1",
     "sass": "^1.23.7",
     "typescript": "^4.6.4"

diff --git a/e2e/2.x/basic/test.js b/e2e/2.x/basic/test.js
@@ -42,8 +42,10 @@ 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 filePath = './components/Basic.vue'
+  const fileString = readFileSync(resolve(__dirname, filePath), {
+    encoding: 'utf8'
+  })
   const config = {
     moduleFileExtensions: ['js', 'vue']
   }
@@ -56,16 +58,14 @@ test('generates source maps for .vue files', () => {
 })
 
 test('generates source maps using src attributes', () => {
-  const filePath = resolve(__dirname, './components/SourceMapsSrc.vue')
-  const fileString = readFileSync(filePath, { encoding: 'utf8' })
+  const filePath = './components/SourceMapsSrc.vue'
+  const fileString = readFileSync(resolve(__dirname, filePath), {
+    encoding: 'utf8'
+  })
 
-  const config = {
-    moduleFileExtensions: ['js', 'vue']
-  }
+  const config = { moduleFileExtensions: ['js', 'vue'] }
 
-  const { map } = jestVue.process(fileString, filePath, {
-    config
-  })
+  const { map } = jestVue.process(fileString, filePath, { config })
 
   expect(JSON.parse(map)).toMatchSnapshot()
 })

diff --git a/e2e/2.x/custom-transformers/package.json b/e2e/2.x/custom-transformers/package.json
@@ -14,13 +14,13 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@vue/test-utils": "^1.1.0",
-    "babel-jest": "^28.0.2",
-    "jest": "28.x",
-    "jest-environment-jsdom": "28.0.2",
+    "@vue/vue2-jest": "^29.0.0",
+    "babel-jest": "29.x",
+    "jest": "29.x",
+    "jest-environment-jsdom": "29.x",
     "postcss": "^7.0.13",
     "postcss-color-function": "^4.0.1",
-    "sass": "^1.23.7",
-    "@vue/vue2-jest": "^28.0.0"
+    "sass": "^1.23.7"
   },
   "jest": {
     "testEnvironment": "jsdom",

diff --git a/e2e/2.x/sass-importer/entry/package.json b/e2e/2.x/sass-importer/entry/package.json
@@ -15,14 +15,14 @@
   "devDependencies": {
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
+    "@vue/vue2-jest": "^29.0.0",
     "@vue/test-utils": "^1.1.0",
-    "babel-jest": "^28.0.2",
-    "jest": "28.x",
-    "jest-environment-jsdom": "28.0.2",
+    "babel-jest": "29.x",
+    "jest": "29.x",
+    "jest-environment-jsdom": "29.x",
     "postcss": "^7.0.13",
     "postcss-color-function": "^4.0.1",
-    "sass": "^1.23.7",
-    "@vue/vue2-jest": "^28.0.0"
+    "sass": "^1.23.7"
   },
   "jest": {
     "testEnvironment": "jsdom",

diff --git a/e2e/2.x/style/jest.config.js b/e2e/2.x/style/jest.config.js
@@ -0,0 +1,23 @@
+const os = require('node:os')
+
+/** @type {import('@jest/types').Config.InitialOptions} */
+module.exports = {
+  testEnvironment: 'jsdom',
+  moduleFileExtensions: ['js', 'json', 'vue'],
+  transform: {
+    '^.+\\.js$': 'babel-jest',
+    '^.+\\.vue$': '@vue/vue2-jest'
+  },
+  moduleNameMapper: {
+    '^~tmp/(.*)': `${os.tmpdir()}/$1`,
+    '^~?__styles/(.*)$': '<rootDir>/components/styles/$1'
+  },
+  globals: {
+    'vue-jest': {
+      resources: {
+        scss: ['variables.scss'],
+        less: ['variables.less']
+      }
+    }
+  }
+}
diff --git a/e2e/2.x/style/package.json b/e2e/2.x/style/package.json
@@ -14,39 +14,12 @@
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
     "@vue/test-utils": "^1.1.0",
-    "jest": "28.x",
+    "@vue/vue2-jest": "^29.0.0",
+    "jest": "29.x",
+    "jest-environment-jsdom": "29.x",
     "less": "^3.9.0",
     "postcss": "^7.0.13",
     "sass": "^1.23.7",
-    "stylus": "^0.54.5",
-    "@vue/vue2-jest": "^28.0.0"
-  },
-  "jest": {
-    "testEnvironment": "jsdom",
-    "moduleFileExtensions": [
-      "js",
-      "json",
-      "vue"
-    ],
-    "transform": {
-      "^.+\\.js$": "babel-jest",
-      "^.+\\.vue$": "@vue/vue2-jest"
-    },
-    "moduleNameMapper": {
-      "^~tmp/(.*)": "/tmp/$1",
-      "^~?__styles/(.*)$": "<rootDir>/components/styles/$1"
-    },
-    "globals": {
-      "vue-jest": {
-        "resources": {
-          "scss": [
-            "variables.scss"
-          ],
-          "less": [
-            "variables.less"
-          ]
-        }
-      }
-    }
+    "stylus": "^0.54.5"
   }
 }
diff --git a/e2e/2.x/style/setup.js b/e2e/2.x/style/setup.js
@@ -1,12 +1,13 @@
 const fs = require('fs')
+const os = require('node:os')
 
 const testDir = '../../../node_modules/vue-jest-test'
 
 if (!fs.existsSync(testDir)) {
   fs.mkdirSync(testDir)
 }
 
-fs.openSync('/tmp/absolute.scss', 'w')
+fs.openSync(`${os.tmpdir()}/absolute.scss`, 'w')
 fs.openSync(`${testDir}/_partial.scss`, 'w')
 fs.openSync(`${testDir}/foo.bar.scss`, 'w')
 fs.openSync(`${testDir}/baz.css`, 'w')

diff --git a/e2e/3.x/babel-in-package/package.json b/e2e/3.x/babel-in-package/package.json
@@ -12,11 +12,11 @@
   "devDependencies": {
     "@babel/core": "^7.9.0",
     "@babel/preset-env": "^7.9.0",
-    "@vue/vue3-jest": "^28.0.0",
+    "@vue/vue3-jest": "^29.0.0",
     "coffeescript": "^2.3.2",
-    "jest": "^28.0.0",
-    "jest-environment-jsdom": "28.0.2",
-    "ts-jest": "^28.0.1",
+    "jest": "29.x",
+    "jest-environment-jsdom": "29.x",
+    "ts-jest": "^29.0.0-next.0",
     "typescript": "^4.6.4"
   },
   "jest": {

diff --git a/e2e/3.x/basic/__snapshots__/test.js.snap b/e2e/3.x/basic/__snapshots__/test.js.snap
@@ -1,12 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`generates source maps for .vue files 1`] = `
-"\\"use strict\\";
+""use strict";
 
-Object.defineProperty(exports, \\"__esModule\\", {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports[\\"default\\"] = void 0;
+exports["default"] = void 0;
 var _default = {
   name: 'basic',
   computed: {
@@ -30,36 +30,36 @@ var _default = {
     }
   }
 };
-exports[\\"default\\"] = _default;
-\\"use strict\\";
+exports["default"] = _default;
+"use strict";
 
-Object.defineProperty(exports, \\"__esModule\\", {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.render = render;
 
-var _vue = require(\\"vue\\");
+var _vue = require("vue");
 
 var _hoisted_1 = {
-  \\"class\\": \\"hello\\"
+  "class": "hello"
 };
 
 function render(_ctx, _cache) {
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)(\\"div\\", _hoisted_1, [(0, _vue.createElementVNode)(\\"h1\\", {
-    \\"class\\": (0, _vue.normalizeClass)(_ctx.headingClasses)
+  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", _hoisted_1, [(0, _vue.createElementVNode)("h1", {
+    "class": (0, _vue.normalizeClass)(_ctx.headingClasses)
   }, (0, _vue.toDisplayString)(_ctx.msg), 3
   /* TEXT, CLASS */
   )]);
-};exports.default = {...exports.default, render};;exports.default = {...exports.default, __cssModules: {\\"css\\":{\\"testA\\":\\"testA\\"},\\"$style\\":{\\"testB\\":\\"testB\\"}}}"
+};exports.default = {...exports.default, render};;exports.default = {...exports.default, __cssModules: {"css":{"testA":"testA"},"$style":{"testB":"testB"}}}"
 `;
 
 exports[`generates source maps using src attributes 1`] = `
-"\\"use strict\\";
+""use strict";
 
-Object.defineProperty(exports, \\"__esModule\\", {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports[\\"default\\"] = void 0;
+exports["default"] = void 0;
 var _default = {
   name: 'basic',
   computed: {
@@ -83,23 +83,23 @@ var _default = {
     }
   }
 };
-exports[\\"default\\"] = _default;
-\\"use strict\\";
+exports["default"] = _default;
+"use strict";
 
-Object.defineProperty(exports, \\"__esModule\\", {
+Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.render = render;
 
-var _vue = require(\\"vue\\");
+var _vue = require("vue");
 
 var _hoisted_1 = {
-  \\"class\\": \\"hello\\"
+  "class": "hello"
 };
 
 function render(_ctx, _cache) {
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)(\\"div\\", _hoisted_1, [(0, _vue.createElementVNode)(\\"h1\\", {
-    \\"class\\": (0, _vue.normalizeClass)(_ctx.headingClasses)
+  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", _hoisted_1, [(0, _vue.createElementVNode)("h1", {
+    "class": (0, _vue.normalizeClass)(_ctx.headingClasses)
   }, (0, _vue.toDisplayString)(_ctx.msg), 3
   /* TEXT, CLASS */
   )]);