Question

我已经在互联网上搜索过了，而且只是在翻译过程中出现了错综复杂的描述，这些描述似乎涵盖了React Router上的所有内容。由于我的例子受到公司隐私保护，我提供了一个简单的代理示例来解释我的困境。

我有一个简单的React Router因此：

  <Router history={hashHistory}>
    <Route path ="/" component={AppContainer} />
    <Route path ="/user/:userId" component={App} />
  </Router>

只需在加载整个应用程序时直接呈现。您可以清楚地看到，只有两个路由，一个用于根，另一个用Id加载。

然而，测试这已经证明有些问题，因为文档和示例非常模糊且非特定。对于我们的大多数应用程序单元测试，我们使用的是Expect和常用的ReactUtils。我希望这里的解决方案同样清晰简单，但一个例子仍然是难以捉摸的。

因此，在我们的测试中，这是我的意图，（假设测试是相应的设置）：

beforeEach(done=>{

mountNode = document.createElement("div");

appRouter = render((
  <Router history={hashHistory}>
    <Route path ="/" component={AppContainer} />
    <Route path ="/user/:userId" component={App} />
  </Router>),
  mountNode);

done();

}）;

然后，我希望提供一个简单的方法：

it("should render the ApplicationContainer view",()=>{
    appRouter.route("/");
    // test Application Component is rendered
  });

it("should render the App view",()=>{
   appRouter.route("/user/1234");
   // test View Component is rendered and has props.params
  });

当然，Router.route（）不是这样的功能，我的目的是提供一个关于我如何处理这个问题的想法。当然，检查渲染的组件不是问题，我的核心问题是如何强制路由器路由。

是否有任何善良的灵魂可以提供一些指导，可能是一个简单的例子，特别是在避免试图推动一些新的图书馆（例如Jest），当然，除非绝对必要。

先谢谢。

如何使用最新的React路由器测试2个简单路由，避免膨胀和更多库

0 个答案: