用react路由器v4测试安装的组件

Question

我正在将我们的应用程序迁移到react-router@4.x，在获得使用enzyme的mount函数的测试时遇到了困难。

每当我挂载具有withRouter-wrapped子组件的组件时，都会遇到麻烦。

下面是我正在测试的一个简化情况的示例：

class SomePage extends React.Component {
  componentDidMount() {
    this.props.getData();
  }
  render() {
    return (
      <div>
        <ComponentWrappedInWithRouter />
      </div>
    );
  }
}

const Component = (props) => (
  <button onClick={() => this.props.history.push('/new-route') }>
    Click to navigate
  </button>
);

const ComponentWrappedInWithRouter = withRouter(Component);

现在，我想测试一下，SomePage在挂载后调用了它的支柱getData。愚蠢的例子，我知道，但结构应该是足够的。

每当我编写使用enzyme的mount的测试时，我都会得到以下错误：

TypeError: Cannot read property 'route' of undefined
  at Route.computeMatch (node_modules/react-router/Route.js:68:22)
  at new Route (node_modules/react-router/Route.js:47:20)

现在，我认为发生这种情况的原因是，我试图为上下文中没有router的组件调用router--也就是说，它没有被包装在<BrowserRouter />或其兄弟姐妹中。

这不是react-router@3.x的问题，但由于目前的专业是完全重写，我完全理解这些问题会出现。

我有什么办法解决这个问题吗？

Answer 1

非常简单:将您的组件从MemoryRouter中从react-router-dom中包装起来，您就可以继续了。

https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/MemoryRouter.md