test: demo snapshot testing (#3916)

* Run snapshot testing against all demos

* Split demo tests

* ignore coverage folder

* Upgrade antd-demo-jest

* enable cache

* intergate with coveralls.io

* Add node test

* Set worker to 2

https://github.com/facebook/jest/issues/1742

* config coverage

* Set default supportServerRender to true

.babelrc

@@ -1,3 +1,6 @@
 {
-  "presets": ["es2015", "react", "stage-0"]
+  "presets": ["es2015", "react", "stage-0"],
+  "plugins": [
+    "add-module-exports"
+  ]
 }

.gitignore

@@ -30,3 +30,4 @@ config/base.yaml
 components/**/*.js
 components/**/*.jsx
 /.vscode/
+/coverage

.jest.node.json

@@ -0,0 +1,15 @@
+{
+  "moduleFileExtensions": [
+    "ts",
+    "tsx",
+    "js",
+    "md"
+  ],
+  "transform": {
+    "\\.tsx?$": "node_modules/typescript-babel-jest",
+    "tests/.*\\.js$": "node_modules/babel-jest",
+    "\\.md$": "node_modules/antd-demo-jest"
+  },
+  "testRegex": "/tests/node/.*\\.test\\.js$",
+  "testEnvironment": "node"
+}

.travis.yml

@@ -4,3 +4,6 @@ language: node_js
 
 node_js:
   - "6"
+
+after_script:
+  - cat ./coverage/lcov.info | node_modules/coveralls/bin/coveralls.js

components/table/demo/grouping-columns.md

@@ -86,7 +86,7 @@ for (let i = 0; i < 100; i++) {
   data.push({
     key: i,
     name: 'John Brown',
-    age: Math.ceil(Math.random() * 100),
+    age: i + 1,
     street: 'Lake Park',
     building: 'C',
     number: 2035,

components/transfer/demo/basic.md

@@ -22,12 +22,12 @@ for (let i = 0; i < 20; i++) {
     key: i.toString(),
     title: `content${i + 1}`,
     description: `description of content${i + 1}`,
-    disabled: Math.random() * 3 < 1,
+    disabled: i % 3 < 1,
   });
 }
 
 const targetKeys = mockData
-        .filter(() => Math.random() * 2 > 1)
+        .filter(item => +item.key % 3 > 1)
         .map(item => item.key);
 
 const App = React.createClass({

components/upload/index.tsx

@@ -71,6 +71,7 @@ export default class Upload extends React.Component<UploadProps, any> {
     listType: 'text', // or pictrue
     className: '',
     disabled: false,
+    supportServerRender: true,
   };
 
   recentUploadStatus: boolean | PromiseLike<any>;

package.json

@@ -78,20 +78,22 @@
   "devDependencies": {
     "@types/react": "~0.14.41",
     "@types/react-dom": "~0.14.18",
+    "antd-demo-jest": "^1.0.5",
     "antd-tools": "0.14.2",
     "babel-cli": "^6.18.0",
-    "babel-preset-es2015": "^6.18.0",
-    "babel-preset-react": "^6.16.0",
-    "babel-preset-stage-0": "^6.16.0",
     "babel-eslint": "^7.1.0",
     "babel-jest": "^17.0.0",
     "babel-plugin-import": "^1.0.0",
     "babel-plugin-transform-runtime": "~6.15.0",
+    "babel-preset-es2015": "^6.18.0",
+    "babel-preset-react": "^6.16.0",
+    "babel-preset-stage-0": "^6.16.0",
     "bisheng": "^0.17.0",
     "bisheng-plugin-antd": "~0.6.0",
     "bisheng-plugin-description": "^0.1.1",
     "bisheng-plugin-react": "^0.3.0",
     "bisheng-plugin-toc": "^0.3.0",
+    "coveralls": "^2.11.15",
     "css-split-webpack-plugin": "^0.2.1",
     "dekko": "^0.2.0",
     "dora-plugin-upload": "^0.3.1",
@@ -107,6 +109,7 @@
     "eslint-plugin-markdown": "*",
     "eslint-plugin-react": "^6.1.2",
     "eslint-tinker": "^0.4.0",
+    "glob": "^7.1.1",
     "history": "^4.4.0",
     "jest": "^17.0.1",
     "jest-cli": "^17.0.0",
@@ -133,7 +136,8 @@
     "react-sublime-video": "^0.2.0",
     "reqwest": "^2.0.5",
     "typescript-babel-jest": "^0.1.5",
-    "values.js": "^1.0.3"
+    "values.js": "^1.0.3",
+    "xhr2": "^0.1.3"
   },
   "babel": {
     "presets": [
@@ -143,7 +147,7 @@
     ]
   },
   "scripts": {
-    "test": "npm run lint && npm run dist && npm run jest && npm run site",
+    "test": "npm run lint && npm run dist && npm run jest -- --coverage -w 2 && npm run jest:node -- -w 2 && npm run site",
     "lint": "npm run tslint && npm run eslint && npm run demolint && npm run lesshint",
     "tslint": "antd-tools run ts-lint && npm run compile && rm -rf lib",
     "eslint": "eslint test site scripts ./.eslintrc.js ./webpack.config.js --ext '.js,.jsx,.tsx' --ignore-pattern '!.eslintrc.js'",
@@ -151,7 +155,8 @@
     "lesshint": "lesshint components -r scripts/lesshint-report.js",
     "eslint-fix": "eslint --fix test site scripts ./.eslintrc.js ./webpack.config.js --ext '.js,.jsx,.tsx' --ignore-pattern '!.eslintrc.js' && eslint-tinker ./components/*/demo/*.md",
 
-    "jest": "jest --no-cache",
+    "jest": "jest",
+    "jest:node": "jest --config .jest.node.json",
 
     "clean": "antd-tools run clean",
     "dist": "antd-tools run dist && node ./tests/dekko/dist.test.js",
@@ -174,19 +179,29 @@
       "tsx",
       "js",
       "jsx",
-      "json"
+      "json",
+      "md"
     ],
     "modulePathIgnorePatterns": [
       "/_site/"
     ],
     "testPathIgnorePatterns": [
       "dekko",
-      "/node_modules/"
+      "/node_modules/",
+      "node"
     ],
     "transform": {
-      ".*": "node_modules/typescript-babel-jest"
+      "\\.tsx?$": "node_modules/typescript-babel-jest",
+      "tests/.*\\.js$": "node_modules/babel-jest",
+      "\\.md$": "node_modules/antd-demo-jest"
     },
-    "testRegex": "(/tests/.*|\\.(test|spec))\\.(js)$"
+    "testRegex": "/tests/.*\\.test\\.js$",
+    "coveragePathIgnorePatterns": [
+      "/node_modules/",
+      "components/.*/demo",
+      "/dist/",
+      "/tests/"
+    ]
   },
   "pre-commit": [
     "lint"

tests/affix/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('affix');

tests/alert/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('alert');

tests/anchor/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('anchor');

tests/auto-complete/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('auto-complete');

tests/back-top/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('back-top');

tests/badge/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('badge');

tests/breadcrumb/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('breadcrumb');

tests/button/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('button');

tests/button.test.js → tests/button/index.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { render } from 'enzyme';
 import { renderToJson } from 'enzyme-to-json';
-import Button from '../components/button/button';
+import Button from '../../components/button';
 
 describe('Button', function() {
   it('renders correctly', () => {

tests/calendar/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('calendar');

tests/card/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('card');

tests/carousel/demo.test.js

@@ -0,0 +1,12 @@
+import demoTest from '../shared/demoTest';
+
+// https://github.com/WickyNilliams/enquire.js/issues/82
+window.matchMedia = window.matchMedia || function() {
+  return {
+    matches : false,
+    addListener : function() {},
+    removeListener: function() {}
+  };
+};
+
+demoTest('carousel');

tests/checkbox/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('checkbox');

tests/collapse/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('collapse');

tests/date-picker/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('date-picker');

tests/dropdown/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('dropdown');

tests/form/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('form');

tests/grid/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('grid');

tests/icon.test.js → tests/icon/index.test.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import TestUtils from 'react-addons-test-utils';
 import { wrap } from 'react-stateless-wrapper';
-import AntIcon from '../components/icon/index';
+import AntIcon from '../../components/icon/index';
 const Icon = wrap(AntIcon);
 
 describe('Icon', function() {

tests/input-number/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('input-number');

tests/input/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('input');

tests/layout.test.js → tests/layout/index.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import TestUtils from 'react-addons-test-utils';
-let { Col, Row } = require('../components/grid/index');
+let { Col, Row } = require('../../components/grid/index');
 
 describe('Grid', function() {
   it('should render Col', () => {

tests/locale-provider/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('locale-provider');

tests/mention/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('mention', { skip: true });

tests/menu/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('menu', { skip: true });

tests/message/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('message');

tests/modal/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('modal');

tests/notification/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('notification');

tests/pagination/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('pagination');

tests/popconfirm/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('popconfirm');

tests/popover/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('popover');

tests/popover.test.js → tests/popover/index.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import TestUtils from 'react-addons-test-utils';
-import Popover from '../components/popover/index';
+import Popover from '../../components/popover/index';
 
 describe('Popover', function() {
   it('should show overlay when trigger is clicked', () => {

tests/progress/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('progress');

tests/radio/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('radio');

tests/rate/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('rate');

tests/select/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('select');

tests/shared/demoTest.js

@@ -0,0 +1,16 @@
+import glob from 'glob'
+import { render } from 'enzyme';
+import { renderToJson } from 'enzyme-to-json';
+
+export default function demoTest(component, options = {}) {
+  const testMethod = options.skip ? test.skip : test;
+  const files = glob.sync(`./components/${component}/demo/*.md`);
+
+  files.forEach(file => {
+    testMethod(`renders ${file} correctly`, () => {
+      const demo = require('../.' + file);
+      const wrapper = render(demo);
+      expect(renderToJson(wrapper)).toMatchSnapshot();
+    });
+  });
+}

tests/slider/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('slider');

tests/spin/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('spin');

tests/steps/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('steps');

tests/switch/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('switch');

tests/table/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('table');

tests/tabs/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('tabs');

tests/tag/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('tag');

tests/time-picker/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('time-picker');

tests/timeline/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('timeline');

tests/tooltip/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('tooltip');

tests/transfer/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('transfer');

tests/tree-select/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('tree-select');

tests/tree/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('tree');

tests/upload/demo.test.js

@@ -0,0 +1,3 @@
+import demoTest from '../shared/demoTest';
+
+demoTest('upload');