先来一个简单的小组件：import React, { Component } from 'react'
class Bar extends Component {
render() {
return (
And I am Bar!
);
}
}
export default Bar;好了，到这里就足够了，来看看测试如何写：import React from 'react';
import expect from 'expect';
import TestUtils from 'react-addons-test-utils';
import Bar from '../../app/js/components/test/Bar';
describe('Bar components', () => {
before('render and locate element ', function() {
const renderedComponent = TestUtils.renderIntoDocument(
);
const bar = TestUtils.findRenderedDOMComponentWithClass(
renderedComponent,
'bar'
);
this.bar = bar;
});
it('bar should exist', function() {
expect(this.bar).toExist();
});
it('bar should be closed', function() {
expect(this.bar.getAttribute('class')).toBe('bar');
});
})在运行前，做个简单的配置：package.json在scripts中添加"test": "NODE_PATH=./app/js/lib ./node_modules/mocha/bin/mocha --compilers js:babel-register --recursive --require ./test/setup.js",
"test:watch": "npm test -- --watch"添加NODE_PATH的原因是我要加载自己的lib库，不然在执行mocha的时候，会因为某些组建中调用了自己的库，而导致找不到对一个恩lib而报错。这里还添加了一个setup.js,这个主要是为了解决类似window这类的问题，毕竟react渲染是需要dom的嘛。setup.js代码如下：import { jsdom } from 'jsdom';
global.document = jsdom('')
global.window = document.defaultView
global.navigator = global.window.navigator如果缺少啥lib的话就自己去安装吧。