chore(button): test jest

babel.config.js

@@ -1,3 +0,0 @@
-module.exports = {
-  presets: ['@vue/cli-plugin-babel/preset']
-};

jest.config.js

@@ -0,0 +1,15 @@
+module.exports = {
+  moduleFileExtensions: ['vue', 'js', 'ts'],
+  preset: 'ts-jest',
+  testEnvironment: 'jsdom',
+  transform: {
+    '^.+\\.vue$': 'vue-jest', // vue 文件用 vue-jest 转换
+    '^.+\\.ts$': 'ts-jest' // ts 文件用 ts-jest 转换
+  },
+  // 匹配 __tests__ 目录下的 .js/.ts 文件 或其他目录下的 xx.test.js/ts xx.spec.js/ts
+  testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.(ts)$',
+  // 支持源代码中相同的 `@` -> `src` 别名
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1'
+  }
+};

package.json

@@ -50,7 +50,8 @@
     "generate:file": "node jd/generate-nutui.js",
     "generate:types": "node jd/generate-types.js",
     "generate:themes": "node jd/generate-themes.js",
-    "prepare": "husky install"
+    "prepare": "husky install",
+    "test": "jest"
   },
   "dependencies": {
     "axios": "^0.21.0",
@@ -62,12 +63,14 @@
   "devDependencies": {
     "@commitlint/cli": "^10.0.0",
     "@commitlint/config-conventional": "^10.0.0",
+    "@types/jest": "^26.0.22",
     "@types/node": "^14.14.31",
     "@vitejs/plugin-legacy": "^1.3.2",
     "@vitejs/plugin-vue": "^1.2.1",
     "@vue/compiler-sfc": "^3.0.11",
     "@vue/eslint-config-prettier": "^6.0.0",
     "@vue/eslint-config-typescript": "^5.0.2",
+    "@vue/test-utils": "^2.0.0-rc.6",
     "eslint": "^6.7.2",
     "eslint-plugin-prettier": "^3.1.3",
     "eslint-plugin-vue": "^7.0.0-0",
@@ -75,12 +78,15 @@
     "fs-extra": "^9.1.0",
     "highlight.js": "^10.3.1",
     "husky": "^6.0.0",
+    "jest": "^26.6.3",
     "lint-staged": "^10.5.0",
     "prettier": "^1.19.1",
     "transliteration": "^2.2.0",
+    "ts-jest": "^26.5.5",
     "typescript": "^4.1.5",
     "vite": "^2.1.5",
-    "vite-plugin-md": "^0.6.3"
+    "vite-plugin-md": "^0.6.3",
+    "vue-jest": "^5.0.0-alpha.7"
   },
   "eslintConfig": {
     "root": true,
@@ -110,4 +116,4 @@
     "type": "git",
     "url": "https://github.com/jdf2e/nutui.git"
   }
-}
+}

src/packages/button/__tests__/button.spec.ts

@@ -0,0 +1,18 @@
+import { mount } from '@vue/test-utils';
+import Button from '../index.vue';
+
+test('emit click event', () => {
+  const wrapper = mount(Button);
+
+  wrapper.trigger('click');
+  expect(wrapper.emitted('click')!.length).toEqual(1);
+});
+
+test('slot test', async () => {
+  const wrapper = mount(Button, {
+    slots: {
+      default: '按钮测试'
+    }
+  });
+  expect(wrapper.html()).toContain('按钮测试');
+});

tsconfig.json

@@ -14,7 +14,7 @@
     "esModuleInterop": true,
     "lib": ["esnext", "dom"],
     "outDir": "./tsc/test",
-    "types": ["vite/client"],
+    "types": ["vite/client", "jest"],
     "paths": {
       "@/*": ["src/*"]
     }