单元测试 – 使用Link测试React路由器

以下是我要测试的内容：

零件

import React from 'react';
import { Link } from 'react-router';

class Categories extends React.Component {

constructor(props,context){
    super(props);
    context.router
}

render() {
    return (
        <nav className="categories">
          <ul>
              <li><Link to="devices">Devices</Link></li>
              <li><Link to="cases">Cases</Link></li>
              <li><Link to="layouts">Layouts</Link></li>
              <li><Link to="designs">Designs</Link></li>
          </ul>
        </nav>
    );
  }
}

Categories.contextTypes = {
 router: React.PropTypes.func.isRequired
};

export default Categories;

StubRouterContext

import React from 'react';
import objectAssign from 'object-assign';

var stubRouterContext = (Component,props,stubs) => {
function RouterStub() { }

objectAssign(RouterStub,{
  makePath () {},makeHref () {},transitionTo () {},replaceWith () {},goBack () {},getCurrentPath () {},getCurrentRoutes () {},getCurrentPathname () {},getCurrentParams () {},getCurrentQuery () {},isActive () {},getRouteAtDepth() {},setRouteComponentAtDepth() {}
 },stubs)

return React.createClass({
childContextTypes: {
    router: React.PropTypes.func,routeDepth: React.PropTypes.number
},getChildContext () {
    console.log('blah');
  return {
    router: RouterStub,routeDepth: 0
  };
},render () {
  return <Component {...props} />
}
});
};

export default stubRouterContext;

组件测试

var expect = require('chai').expect;

var React = require('react/addons');
var Categories = require('../app/src/js/components/Categories.React.js');
var stubRouterContext = require('../test-utils/stubRouterContext.js');
var TestUtils = React.addons.TestUtils;

describe('Categories',function() {
  var categoriesWithContext = stubRouterContext(Categories);

  it('renders Categories properly',function() {
  var categories = TestUtils.renderIntoDocument(<categoriesWithContext />,{});
});

it('renders 4 links',function() {
  var catLinks = TestUtils.scryRenderedDOMComponentsWithTag(categoriesWithContext,'a');
  expect(catLinks).to.have.length(4);
});
});