前端 CI 测试

集成 测试 工具: Travis CI, Jest, nyc(Istanbul) mocha

Travis CI

Office Doc

Travis CI 提供的是持续集成服务（Continuous Integration，简称 CI）。它绑定 Github 上面的项目，只要有新的代码，就会自动抓取。然后，提供一个运行环境，执行测试，完成构建，还能部署到服务器。

先决条件 To start using Travis CI, make sure you have:

• A GitHub or Bitbucket or GitLab or Assembla account.
• Owner permissions for a project hosted on GitHub or Bitbucket or GitLab or Assembla.

github 集成 案例

1. github使用Travis，登陆Travis官网，用 github 登陆
2. Click on your profile picture in the top right of your Travis Dashboard, click Settings and then the green Activate button, and select the repositories you want to use with Travis CI.
3. Add the .travis.yml file at root, commit and push to trigger a Travis CI build
4. Check the build status page to see if your build passes or fails according to the return status of the build command by visiting Travis CI and selecting your repository.

Travis 的运行流程很简单，任何项目都会经过两个阶段。

• install 阶段：安装依赖
• script 阶段： 指定构建或测试脚本

Node 项目 实例

language: node_js
node_js:
  - "8"
cache:
  directories:
    - node_modules
branches:
  only:
    - master
env:
  - DB=postgres
before_install:
  - npm i -g npm@version-number
install:
script:
  - ember test --server

部署

script阶段结束以后，还可以设置通知步骤（notification）和部署步骤（deployment），它们不是必须的. 部署的脚本可以在script阶段执行，也可以使用 Travis 为几十种常见服务提供的快捷部署功能

deploy:
  provider: pages
  skip_cleanup: true
  github_token: $GITHUB_TOKEN # Set in travis-ci.org 
     dashboard
  on:
    branch: master

nyc(Istanbul) 是 JavaScript 程序的代码覆盖率工具

参见原理

四个指标

• 行覆盖率（line coverage）：是否每一行都执行了？
• 函数覆盖率（function coverage）：是否每个函数都调用了？
• 分支覆盖率（branch coverage）：是否每个if代码块都执行了？
• 语句覆盖率（statement coverage）：是否每个语句都执行了？

nyc的使用

package.json 配置， 或者用根目录下 nyc.config.js

"nyc": {
    "all": true,
    "check-coverage": true,
    "branches": 100,
    "function": 100,
    "lines": 100,
    "statements": 100,
    "reporter": [
      "text",
      "lcov"
    ],
    "include": [
      "src"
    ],
    "sourceMap": false,
    "instrument": false,
    "require": [
      "babel-register"
    ]
  },

nyc 与测试框架组合