test: add snapshot support

antd-tools/getBabelCommonConfig.js

@@ -28,5 +28,10 @@ module.exports = function (modules) {
       }],
     ],
     plugins,
+    env: {
+      test: {
+        plugins: [require.resolve('babel-plugin-istanbul')],
+      },
+    },
   }
 }

components/button/__test__/__snapshots__/index.test.md

@@ -0,0 +1,8 @@
+# `Button`
+
+#### `create primary button`
+
+```
+"<button type=\"button\" class=\"ant-btn ant-btn-primary\"><span>按 钮</span></button>"
+```
+

components/button/__test__/index.spec.js

@@ -2,6 +2,9 @@ import Button from '../index'
 import Icon from '../../icon'
 import { mount } from 'avoriaz'
 import Vue from 'vue'
+import { matchSnapshot } from "chai-karma-snapshot";
+import { use, expect, assert } from "chai";
+use(matchSnapshot);
 
 describe('Button', () => {
   it('create primary button', () => {
@@ -10,6 +13,7 @@ describe('Button', () => {
         return <Button type='primary'>按钮</Button>
       },
     })
+    expect(wrapper.html()).to.matchSnapshot();
     expect(wrapper.hasClass('ant-btn-primary')).to.equal(true)
   })
   it('renders Chinese characters correctly', (done) => {

package.json

@@ -75,6 +75,7 @@
     "babel-preset-env": "^1.6.1",
     "case-sensitive-paths-webpack-plugin": "^2.1.2",
     "chai": "^4.1.2",
+    "chai-karma-snapshot": "^0.7.0",
     "chalk": "^2.3.2",
     "cheerio": "^1.0.0-rc.2",
     "codecov": "^3.0.0",
@@ -98,17 +99,19 @@
     "husky": "^0.14.3",
     "istanbul-instrumenter-loader": "^3.0.0",
     "jsonp": "^0.2.1",
-    "karma": "^1.4.1",
+    "karma": "^2.0.2",
     "karma-babel-preprocessor": "^7.0.0",
+    "karma-chrome-launcher": "^2.2.0",
     "karma-coverage": "^1.1.1",
     "karma-coverage-istanbul-reporter": "^1.3.0",
     "karma-mocha": "^1.3.0",
-    "karma-phantomjs-launcher": "^1.0.2",
+    "karma-mocha-reporter": "^2.2.5",
-    "karma-phantomjs-shim": "^1.4.0",
+    "karma-mocha-snapshot": "^0.2.1",
     "karma-sinon-chai": "^1.3.1",
+    "karma-snapshot": "^0.6.0",
     "karma-sourcemap-loader": "^0.3.7",
     "karma-spec-reporter": "0.0.31",
-    "karma-webpack": "^2.0.2",
+    "karma-webpack": "^2.0.13",
     "less": "^2.7.2",
     "less-loader": "^4.0.5",
     "less-plugin-npm-import": "^2.1.0",
@@ -118,10 +121,12 @@
     "merge2": "^1.2.1",
     "minimist": "^1.2.0",
     "mkdirp": "^0.5.1",
-    "mocha": "^3.2.0",
+    "mocha": "^3.5.3",
+    "mockdate": "^2.0.2",
     "postcss": "^6.0.20",
     "postcss-loader": "^2.1.2",
     "pre-commit": "^1.2.2",
+    "puppeteer": "^1.3.0",
     "querystring": "^0.2.0",
     "reqwest": "^2.0.5",
     "rimraf": "^2.6.2",
@@ -141,7 +146,7 @@
     "vue-loader": "^13.0.5",
     "vue-router": "^3.0.1",
     "vue-template-compiler": "^2.5.15",
-    "webpack": "^3.6.0",
+    "webpack": "^3.11.0",
     "webpack-chunk-hash": "^0.5.0",
     "webpack-dev-server": "^2.8.2",
     "webpack-merge": "^4.1.1"

test/karma.conf.js

@@ -3,24 +3,33 @@
 // we are also using it with karma-webpack
 //   https://github.com/webpack/karma-webpack
 
+const path = require('path')
 const webpack = require('webpack')
 const webpackConfig = require('../webpack.config')
 const merge = require('webpack-merge')
 delete webpackConfig.entry
 const scope = process.argv[5] || ''
+process.env.CHROME_BIN = require('puppeteer').executablePath()
+function resolve (basePath, suiteName = '') {
+  return path.join(basePath, '../components', suiteName.toLowerCase(), '__test__/__snapshots__', 'index.test.md')
+}
 module.exports = function (config) {
   config.set({
     // to run in additional browsers:
     // 1. install corresponding karma launcher
     //    http://karma-runner.github.io/0.13/config/browsers.html
     // 2. add it to the `browsers` array below.
-    browsers: ['PhantomJS'],
+    browsers: ['ChromeHeadless'],
-    frameworks: ['mocha', 'sinon-chai'],
+    frameworks: ['mocha', 'snapshot', 'mocha-snapshot', 'sinon-chai'],
     reporters: ['spec', 'coverage'],
-    files: ['./index.js'],
+    files: ['../components/**/__snapshots__/**/*.md', './index.js'],
     preprocessors: {
-      './index.js': ['webpack', 'sourcemap', 'coverage'],
+      '../components/**/__snapshots__/**/*.md': ['snapshot'],
+      './index.js': ['webpack', 'sourcemap'],
     },
+    port: 9876,
+    colors: true,
+    // autoWatch: true,
     webpack: merge(
       {
         plugins: [
@@ -37,6 +46,11 @@ module.exports = function (config) {
     webpackMiddleware: {
       noInfo: true,
     },
+    snapshot: {
+      update: !!process.env.UPDATE,
+      prune: !!process.env.PRUNE,
+      pathResolver: resolve, // Custom path resolver,
+    },
     coverageReporter: {
       dir: './coverage',
       reporters: [

webpack.base.config.js

@@ -193,6 +193,7 @@ module.exports = {
     ],
   },
   resolve: {
+    modules: ['node_modules', path.join(__dirname, '../node_modules')],
     extensions: ['.js', '.jsx', '.vue', '.md'],
     alias: {
       'vue$': 'vue/dist/vue.esm.js',