test: add jest

.eslintrc.js

@@ -2,6 +2,7 @@ module.exports = {
   root: true,
   env: {
     node: true,
+    jest: true,
   },
   globals: {
     defineProps: 'readonly',

.gitignore

@@ -5,3 +5,4 @@ dist-ssr
 *.local
 yarn-error.log
 stats.html
+coverage
\ No newline at end of file

babel.config.js

+module.exports = {
+  presets: [
+    ['@babel/preset-env', { targets: { node: 'current' } }],
+    '@babel/preset-typescript',
+  ],
+}

jest.config.js

+/*
+ * For a detailed explanation regarding each configuration property and type check, visit:
+ * https://jestjs.io/docs/configuration
+ */
+
+module.exports = {
+  moduleNameMapper: {
+    '^@/(.*)$': '<rootDir>/src/$1',
+  },
+
+  clearMocks: true,
+
+  collectCoverage: true,
+
+  coverageDirectory: 'coverage',
+
+  testEnvironment: 'jsdom',
+}

package.json

@@ -5,7 +5,7 @@
   "license": "MIT",
   "author": "LeoKu<czc12580520@gmail.com> (https://leoku.top)",
   "scripts": {
-    "build": "vite build",
+    "build": "npm run test && vite build",
     "build:prerelease": "vite build --mode prerelease",
     "deps": "yarn upgrade-interactive --latest",
     "dev": "vite",
@@ -15,7 +15,8 @@
     "lint:style": "stylelint \"src/**/*.{css,scss,vue}\"",
     "lint:ts": "tsc --noEmit --skipLibCheck",
     "prepare": "husky install",
-    "preview": "vite preview"
+    "preview": "vite preview",
+    "test": "jest"
   },
   "dependencies": {
     "canvas-confetti": "^1.4.0",
@@ -27,11 +28,16 @@
     "vuex": "^4.0.2"
   },
   "devDependencies": {
+    "@babel/core": "^7.15.8",
+    "@babel/preset-env": "^7.15.8",
+    "@babel/preset-typescript": "^7.15.0",
     "@types/canvas-confetti": "^1.4.2",
+    "@types/jest": "^27.0.2",
     "@typescript-eslint/eslint-plugin": "^4.32.0",
     "@typescript-eslint/parser": "^4.32.0",
     "@vitejs/plugin-vue": "^1.9.2",
     "@vue/compiler-sfc": "^3.2.19",
+    "babel-jest": "^27.2.5",
     "eslint": "^7.32.0",
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-import": "^2.24.2",
@@ -40,6 +46,7 @@
     "eslint-plugin-tailwindcss": "^1.16.0",
     "eslint-plugin-vue": "^7.18.0",
     "husky": "^7.0.2",
+    "jest": "^27.2.5",
     "lint-staged": "^11.1.2",
     "prettier": "^2.4.1",
     "rollup-plugin-visualizer": "^5.5.2",

src/__tests__/utils.test.ts

+import localeEN from '../i18n/locales/en'
+import localeZH from '../i18n/locales/zh'
+import { highlightJSON } from '../utils'
+
+test('highlightJSON', () => {
+  const str = JSON.stringify({ a: 1, b: '2' })
+  expect(highlightJSON(str)).toMatch('key')
+  expect(highlightJSON(str)).toMatch('number')
+  expect(highlightJSON(str)).toMatch('string')
+})
+
+test('check locales completeness', () => {
+  const zh = Reflect.ownKeys(localeZH).sort()
+  const en = Reflect.ownKeys(localeEN).sort()
+  expect(zh).toEqual(en)
+})

src/utils/constant.ts

@@ -97,7 +97,7 @@ export const NONE = 'none'
 
 export const TRIGGER_PROBABILITY = 0.1
 
-export const SPECIAL_AVATARS: Readonly<AvatarOption>[] = [
+export const SPECIAL_AVATARS: Readonly<AvatarOption[]> = [
   {
     wrapperShape: 'squircle',
     background: {

src/utils/index.ts

@@ -102,7 +102,7 @@ export function getRandomAvatarOption(
   return avatarOption
 }
 
-export function getSpecialAvatarOption() {
+export function getSpecialAvatarOption(): AvatarOption {
   return SPECIAL_AVATARS[Math.floor(Math.random() * SPECIAL_AVATARS.length)]
 }