单元测试 jest

vue 项目增加单元测试

• 在package.json 增加以下配置

// package.json

"devDependencies": {
  "@vue/test-utils": "^1.0.0-beta.13",
  "babel-jest": "^21.2.0",
  "babel-preset-env": "^1.6.0",
  "jest": "^21.2.1",
  "regenerator-runtime": "^0.11.0",
  "vue-template-compiler": "^2.4.4"
},

"scripts": {
  "test": "jest"
},

• 根目录增加 .babelrc

{
  "presets": [
    ["env", {
      "targets:": { "node": "6" } // change this to your node version
    }]
  ]
}

• 安装依赖

npm install

不支持 import
这是因为测试是在 nodejs 的环境下跑的，但是 nodejs 不支持 ES6 的语法，所以需要配置一下

// 根目录 .babelrc 添加以下配置即可

{
  "env": {
    "development": {
      "plugins": [
        "transform-es2015-modules-commonjs"
      ]
    },
    "test": {
      "plugins": [
        "transform-es2015-modules-commonjs"
      ]
    }
  }
}

不支持 locaStorage

• 安装

yarn add --dev jest-localstorage-mock // yarn

或

npm i --save-dev jest-localstorage-mock // npm

• 在你的 package.json 里 jest 配置部分下，创建一个setupFiles阵列并添加jest-localstorage-mock到该阵列中

{
  "jest": {
    "setupFiles": ["jest-localstorage-mock"]
  }
}

官方文档